<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
h1{
text-align: center;
}
</style>
</head>
<body>
<div id="clock">
倒计时：<span>10</span>秒
</div>
<h1></h1>
<script type="text/javascript">
var h1=document.querySelector("h1")
var html=document.querySelector("html")
var charcode;
var num=0;
var time=10;
function rand(){
var random = parseInt(Math.random()*26)
charcode=65+random;
//数字转换成字符
var str = String.fromCharCode(charcode)
h1.innerHTML=str;
}
rand()
//键盘按键事件
html.onkeydown=function(e){
if(charcode==e.keyCode)
{num++;
rand()
h1.style.color="#FFFF00"
//文本阴影
h1.style.textShadow="blue"
}
else{
rand()
h1.style.color="red"
}
}
//计时器
var clock= setInterval(function(){
var span=document.querySelector("span")
time--;
span.innerHTML=time
if(time==0)
{
//删除计时器
clearInterval(clock)
alert("你每分钟能打"+num*6+"字！！！")
}
},1000)
</script>
</body>
</html>
