<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
</style>
</head>
<body onload="sj()">
<p>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</p>
<!--这里通过onclick调用刚刚js中写好的randomTest()函数,-->
<button style=" 80px;height: 30px;" onclick="sj()">看不清</button>
<script type="text/javascript" src="js/fz.js"></script>
<script type="text/javascript">
//定义字符串
var yzm="1234567890QWERTYUIOPASDFGHJKLZXCVBNMqwertyuioplkjhgfdsazxcvbnm";
//获取span标签
var span=document.getElementsByTagName('span');
//定义函数
function sj(){
var code="";
//循环次数
for(var i=0;i<=5;i++){
//取整数值为数组的下标
var zm=parseInt(Math.random()*yzm.length);
//取出随机数组中真正的值
code=yzm[zm];
//将上面取到的<span>元素通过innerHTML赋值code
span[i].innerHTML=code;
//将随机出的值通过style.color赋予颜色,这里使用了自己写的一个封装函数randomColor(),
span[i].style.color=randomColor(); //js代码见尾部.
}
}
</script>
</body>
</html>
这里是封装在js中的随机颜色函数,利用返回rgb的值来给随机数上色;
function randomColor(){
var a=parseInt(Math.random()*256);
var b=parseInt(Math.random()*256);
var c=parseInt(Math.random()*256);
var rgb="rgb("+a+","+b+","+c+")";
return rgb;
}
最终出来的样子就是这样的