隨機指定網頁元素背景色示例

• 2020 年 4 月 21 日
• 筆記

js功能下午剛開通。給自己的部落格做了個「微語」的小功能，大概作用就是在首頁顯示一個含有雞湯文的電影台詞的div。每次刷新網頁或者點按鈕刷新會更新內容。

做完後覺得顏色比較單調（我自己的習慣性問題）。琢磨了一下想出了一個動態改變顏色的辦法。

因為部落格園默認包含了jquery。所以先用js數組定義一個喜歡的顏色列表。隨機取一個出來，然後直接用jquery去改變元素的背景。

放到側邊欄定義裡面，主要程式碼如下：

<script>
$(function(){

setColor();

});

function setColor(){
var colorArr=new Array("#00BCD4","#8bc34a","#f44336","#f44336","#9c27b0","#3f51b5")
var theColor = colorArr[Math.floor((Math.random()*colorArr.length))];
$("#whispers").css("background-color",theColor );
}
</script>