版权声明:本BLOG文章为博主原创文章,转载请注明!如果本BLOG侵犯了您的权益,请联系我 https://blog.csdn.net/Code_Farmer_007/article/details/83691488
1. 在Idea中创建一个html文件,用浏览打开,即是一个点名器
2.源代码如下
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>点名器</title>
<style type="text/css">
{margin: 0;padding: 0;}
.outer{
width: 400px; //宽度
height: 350px; //高度
/*background:red;*/
margin: 10px auto;
}
#name{
width: 300px;
height: 250px;
margin: 10px auto;
text-align: center;
line-height: 250px;
font-size: 60px;
color:red;
}
button{
display: block;
width: 100px;
height: 50px;
font-size: 25px;
text-align: center;
margin: 200px auto 0;
}
</style>
</head>
<body>
<div class="outer">
<div id="name"></div>
<button>开始</button> //创建一个按键
</div>
</body>
<script type="text/javascript">
var divs=document.getElementsByTagName('div')[1];
var btn=document.getElementsByTagName("button")[0];
var flag=true,timer=null;
var arr=["朱茵","王祖贤","戚薇","陈乔恩","胡歌","水野朝阳","江疏影","宋冬野","杨幂","允儿"]; //参与点名的人员
btn.onclick=function(){
if (flag) {
timer=setInterval(function(){
divs.innerHTML=ram();
},20)
btn.innerHTML="停止";
flag=0;
}else{
clearInterval(timer);
btn.innerHTML="开始";
flag=true;
}
}
function ram(){
var x=Math.floor(Math.random()*arr.length);
var result=arr[x];
return result;
}
</script>
</html>
【Ending】
技术,只有在交流的时候才能理解的更透彻!交流Java开发技术,我们正在行动!感谢来过!