djs
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Game</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
<style>
html,body{position: relative;height: 100%;overflow: hidden;}
.flex{display: flex;height: 100%;}
.word{font-size: 180pt;text-align: center;padding: 0;margin:0;vertical-align: middle;margin:auto;}
button{position: absolute;bottom:0;font-size: 50pt;cursor: pointer;}
</style>
<script>
$(function(){
var wordlist=['电脑','乌龟','葛优','ipad']
var t=120;
function js(){
$('#time').text(t--)
console.log(t)
if(t <= 0) {
clearInterval(inter);
}
}
function dati(){
var gettime = setInterval(js, 1000);
var len=wordlist.length;
var nums = Math.floor(Math.random() * len);
$('.word').text(wordlist[nums])
console.log(wordlist.length)
wordlist.splice(nums,1)
if(wordlist.length==0){
$('.word').html('<span style="font-size:100pt;color:#f00">题库用完，请重选题库!</span>')
}
}
$('#begin').click(function(){
dati()
})
})
</script>
</head>
<body>
<div style="font-size:60pt">倒计时：<span class="red" id='time'></span>秒</div>
<div class="flex">
<h1 class='word'>Ready?</h1></div>
<button id="begin"> 下一个 </button>
</body>
</html>本文参与 腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。
原始发表：2020年01月12日，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
腾讯云开发者
