字體顏色動態變換
阿新 • • 發佈：2018-12-22
字體 round align random ima ntb mar 字體顏色 lse
錄制屏幕的工具有點卡，正常的是紅黃交替。
這種情況適合少的，多了就麻煩了。
Math.random()函數產生0.0~1.0的隨機數，與數組的長度相乘取整。
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的隨機數，與數組的長度相乘取整。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);
謝謝瀏覽！
字體顏色動態變換