[HTML]初学者js最简单的随机改变背景颜色
初学者制作登录页面最需要的简单功能改变随机背景颜色
·
利用改变rgb颜色的随机数（Math.random()）给背景颜色赋值
从而实现对背景颜色的随机改变
<script>
function randomNumber(){
a=Math.floor(Math.random()*10)
b=Math.floor(Math.random()*10)
c=Math.floor(Math.random()*10)
d=Math.floor(Math.random()*10)
e=Math.floor(Math.random()*10)
f=Math.floor(Math.random()*10)
backgroundColor="#"+a+b+c+d+e+f
return backgroundColor
}
</script>return 返回值
Math.random（）随机数只能取0-1之间的所有随机数
例如：
<script>
a=Math.random()
console.log(a)
</script>输出结果为：
Math.floor（）向下取整
当两个函数结合起来用就能实现随机取0-9之间的所有随机整数：
Math.floor(Math.random()*10)随机数乘以10再向下取整就能得到较为均衡的0-9之间的随机整数
在写一个方法样式改变背景颜色
<script>
function backGroundColor(){
document.body.style.backgroundColor=randomNumber()
}
</script>最后设置一个按钮调用方法backGroundColor（）
注意驼峰命名法
<button type="button" onclick="backGroundColor()">点我切换背景颜色</button>接下来看源码和效果：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<button type="button" onclick="backGroundColor()">点我切换背景颜色</button>
<script>
function randomNumber(){
a=Math.floor(Math.random()*10)
b=Math.floor(Math.random()*10)
c=Math.floor(Math.random()*10)
d=Math.floor(Math.random()*10)
e=Math.floor(Math.random()*10)
f=Math.floor(Math.random()*10)
backgroundColor="#"+a+b+c+d+e+f
return backgroundColor
}
function backGroundColor(){
document.body.style.backgroundColor=randomNumber()
}
</script>
</body>
</html>效果如下：
华为开发者空间，是为全球开发者打造的专属开发空间，汇聚了华为优质开发资源及工具，致力于让每一位开发者拥有一台云主机，基于华为根生态开发、创新。
更多推荐
4
0- 0
已为社区贡献1条内容
所有评论(0)