知识点
产生随机数:Math.random()生成0到1之间 的小数。
效果如下:
点击时
代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
.test {
width: 180px;
height: 40px;
line-height: 40px;
background-color: #808080;
font-weight: 800;
margin: 100px auto;
font-size: 30px;
text-align: center;
cursor: pointer;
}
</style>
</head>
<body>
<script src="获取元素.js"></script>
<div class="test">
<span>G</span>
<span>h</span>
<span>j</span>
<span>k</span>
</div>
<script>
window.onload = function () {
var spans = my$All('.test span')
var code = ['a','b','c','d','e','A','J','H','O','P','U'] // 11
//产生0-11的随机数 Math.random() 0-1小数 [) [0-11) 10.3-->向下取整
var RanColor = ['red','purple','brown','black','#fff','#234567','#777','#222','#FFE'
,'yellow','pink']
my$('.test').onclick = function () {
//1.产生随机字母 4个 循环放到span标签里
for(var i =0;i<4;i++){
var num =Math.floor( Math.random()*11) //下标 0-10
var num1 =Math.floor( Math.random()*11) //下标 0-10
spans[i].innerText = code[num] //随机字母赋值到span标签里
spans[i].style.color = RanColor[num1]
}
}
}
</script>
</body>
</html>