Javascript結合HTML實現自動換顏色

1、HTML代碼

<div id="H-one">歡迎來到GCLover遊戲俱樂部官網</div>

2、JavaScript代碼

    // 網站標題隨機變色
    var div = document.getElementById("H-one");

    // 產生一個含有10種顏色的隨機顏色庫
    var colorArr = [];
    for(var j = 0; j < 10; j++){
        // “#”號  + 十六進制的顏色編碼方式
        var data = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F'];
        function DisColor(n){
            var res = "";
            for (var i = 0; i < n; i++) {
                var id = Math.ceil(Math.random() * 15);
                res += data[id];
            }
            return res;
        }
        var num = "#" + DisColor(6);
        colorArr[j] = num;
    }
        
    console.log(colorArr);

    // 讓HTML頁面獲取顏色庫中的顏色
        //每隔1秒輸出數組中的一項:無限自動換色。
        function ShowArr(){
            var col = colorArr[Math.floor(Math.random()*colorArr.length)];
            div.style.color = col;
            //console.log(col);
        }
        setInterval("ShowArr()",1000); 
3、效果展示

注意：JavaScript的代碼放置在HTML代碼之後！如果是外部導入，則把<script></script>放置在body的結尾標籤與HTML結尾標籤之間，否則將看不到效果！

聲明：此操作是一個無限循環的操作，在使用完後請關閉瀏覽器窗口，以防止對電腦的損害