码迷,mamicode.com
首页 > 其他好文 > 详细

前端——剪刀石头布

时间:2015-07-20 22:48:07      阅读:101      评论:0      收藏:0      [点我收藏+]

标签:

百度某公开课的第一课

好好玩~

HTML:

<div>
<img id="jiandao" src="https://github.com/baidu-ife/ife/blob/master/2015_summer/asset/jiandao.jpg?raw=true">
<img id="shitou" src="https://github.com/baidu-ife/ife/blob/master/2015_summer/asset/shitou.jpg?raw=true">
<img id="bu" src="https://github.com/baidu-ife/ife/blob/master/2015_summer/asset/bu.jpg?raw=true">
</div>

<img id="my-result">
<span id="result-test"></span>
<img id="computer-result">

JS:

var jiandao = document.getElementById("jiandao");
var shitou = document.getElementById("shitou");
var bu = document.getElementById("bu");

jiandao.onclick = function(){
  document.getElementById("my-result").src="https://github.com/baidu-ife/ife/blob/master/2015_summer/asset/jiandao.jpg?raw=true";
  var computerResult = Math.random();
  if(computerResult<0.33){
    document.getElementById("computer-result").src="https://github.com/baidu-ife/ife/blob/master/2015_summer/asset/jiandao.jpg?raw=true";
    document.getElementById("result-test").innerHTML = "Tie";
  }else if(computerResult<0.67){
    document.getElementById("computer-result").src="https://github.com/baidu-ife/ife/blob/master/2015_summer/asset/shitou.jpg?raw=true";
    document.getElementById("result-test").innerHTML = "Lose";
  }else{
    document.getElementById("computer-result").src="https://github.com/baidu-ife/ife/blob/master/2015_summer/asset/bu.jpg?raw=true";
    document.getElementById("result-test").innerHTML = "Win";
  }
}


shitou.onclick = function(){
  document.getElementById("my-result").src="https://github.com/baidu-ife/ife/blob/master/2015_summer/asset/shitou.jpg?raw=true";
  var computerResult = Math.random();
  if(computerResult<0.33){
    document.getElementById("computer-result").src="https://github.com/baidu-ife/ife/blob/master/2015_summer/asset/jiandao.jpg?raw=true";
    document.getElementById("result-test").innerHTML = "Win";
  }else if(computerResult<0.67){
    document.getElementById("computer-result").src="https://github.com/baidu-ife/ife/blob/master/2015_summer/asset/shitou.jpg?raw=true";
    document.getElementById("result-test").innerHTML = "Tie";
  }else{
    document.getElementById("computer-result").src="https://github.com/baidu-ife/ife/blob/master/2015_summer/asset/bu.jpg?raw=true";
    document.getElementById("result-test").innerHTML = "Lose";
  }
}

bu.onclick = function(){
  document.getElementById("my-result").src="https://github.com/baidu-ife/ife/blob/master/2015_summer/asset/bu.jpg?raw=true";
  var computerResult = Math.random();
  if(computerResult<0.33){
    document.getElementById("computer-result").src="https://github.com/baidu-ife/ife/blob/master/2015_summer/asset/jiandao.jpg?raw=true";
    document.getElementById("result-test").innerHTML = "Lose";
  }else if(computerResult<0.67){
    document.getElementById("computer-result").src="https://github.com/baidu-ife/ife/blob/master/2015_summer/asset/shitou.jpg?raw=true";
    document.getElementById("result-test").innerHTML = "Win";
  }else{
    document.getElementById("computer-result").src="https://github.com/baidu-ife/ife/blob/master/2015_summer/asset/bu.jpg?raw=true";
    document.getElementById("result-test").innerHTML = "Tie";
  }
}

 

前端——剪刀石头布

标签:

原文地址:http://www.cnblogs.com/qscqesze/p/4662810.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!