js设置html字体颜色动态变换
一、如果只是两种颜色轮换
<head> <script> function changecolor() { var b=document.getElementById("a").style.color; if(b=="red"){document.getElementById("a").style.color="yellow";} else {document.getElementById("a").style.color="red";} } setInterval("changecolor()",250)//设置循环速度 </script> </head> <body> <h4 id="a"style="color:red;"> 你好！很高兴见到你！</h4> </body>
录制屏幕的工具有点卡，正常的是红黄交替。
这种情况适合少的，多了就麻烦了。
二、创建数组
1、
<html> <head> <script> function changecolor() { var col=new Array(); col[0]="yellow"; col[1]="blue"; col[2]="green"; col[3]="gray"; document.getElementById('a').style.color=col[parseInt(Math.random() * col.length)]; } setInterval("changecolor()",250) </script> </head> <body onload="changecolor()"> <h4 id="a"style="color:red;">好久不见！</h4> </body> </html>
Math.random()函数产生0.0~1.0的随机数，与数组的长度相乘取整。2、也可以用split()函数切割字符串做成数组
function changeColor()
{
var color="blue|gray|green|red|yellow|white";
color=color.split("|"); //在“|”处切割
document.getElementById("a").style.color=color[parseInt(Math.random() * color.length)];
}
setInterval("changeColor()",250);
谢谢浏览！