我是JavaScript的新手,并编写了这个简短的脚本来为页面的主体选择随机的背景颜色,但是它只会继续执行默认的大小写。我不知道怎么了
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<script>
function chC(){
var cl=document.getElementById('demo');
var colNo=Math.random()*4;
switch (colNo){
case 1:{
cl.style.background='red';
}
case 2:{
cl.style.background='yellow';
}
case 3:{
cl.style.background='pink';
}
default :{
cl.style.background='orange';
}
}
}
</script>
<title></title>
</head>
<body id="demo">
<button type="button" onclick="chC();">change</button>
</body>
</html>
最佳答案
Math.random() * 4
不返回1
,2
或3
,它返回类似
3.4111702758818865
3.9287009509280324
1.1707445457577705
1.5766741186380386
2.6374688586220145
您需要对此进行四舍五入,因为您不包括零,所以我想您想向上取整,但这也将包括
4
,所以谁知道var colNo = Math.ceil( Math.random()*4 ); // 1-4
// or
var colNo = Math.floor( Math.random()*4 ); // 0-3
还有....您的开关/外壳有故障,需要满足条件时才能断开
switch (colNo) {
case 1:
cl.style.background = 'red';
break;
case 2:
cl.style.background = 'yellow';
break;
case 3:
cl.style.background = 'pink';
break;
default:
cl.style.background = 'orange';
}
FIDDLE