0

每次重新加载窗口时，我都希望更改为 div 类的背景颜色。
我使用此代码在刷新时更改正文的背景颜色：

<script type="text/javascript">
<!-- //Enter list of bgcolors:
var bgcolorlist=new Array("silver", "#BAF3C3", "#c3baf3")

document.body.style.background=bgcolorlist[Math.floor(Math.random()*bgcolorlist.length)]
// -->
</script>

但我希望更改“.three”的背景颜色，因此每次重新加载窗口时，每个具有“three”类的 div 都会具有不同的背景颜色（从一组颜色中选择）。
似乎无法弄清楚如何做到这一点，这有可能吗？

4

5 回答 5

1

用这个

var bgcolorlist=new Array("silver", "#BAF3C3", "#c3baf3")

$(".three").css("background-color",bgcolorlist[Math.floor(Math.random()*bgcolorlist.length)]);
于 2012-11-29T12:12:55.563 回答
1

如果必须更改背景颜色，您可以使用localStorage在重新加载页面之前检查背景颜色：

var colours = ['#F00','#0F0'];//my eyes!
var currentColour = +(localStorage.previousBGColour || -1)+1;
currentColour = currentColour >= colours.length ? 0 : currentColour;//if index is not set reset to colour at index 0
document.getElementById('theDiv').style.backgroundColor = colours[currentColour];
localStorage.previousBGColour =  currentColour;//store colour that's currently in use

请注意，并非所有浏览器都支持localStorage：例如，有些人仍在使用旧的、糟糕的 IE8。

jQuery

$(document).ready(function()
{
    (function()
    {//this IIFE is optional, but is just a lot tidier (no vars cluttering the rest of the script)
        var colours = ['#F00','#0F0'],
        currentColour = +(localStorage.previousBGColour || -1) + 1;
        $('#theDiv').css({backgroundColor:colours[currentColour]});
        localStorage.previousBGColour = currentColour;
    }());
}
于 2012-11-29T12:22:29.520 回答
0

使用 JQuery 你可以做到

$(document).ready(function(){
    $('.three').css('background-color',bgcolorlist[Math.floor(Math.random()*bgcolorlist.length));
});
于 2012-11-29T12:13:49.720 回答
0 
var bgcolorlist = ['silver', '#BAF3C3', '#C3BAF3'];

$(function() {
    $('.three').css({
        background: bgcolorlist[Math.floor(Math.random()*bgcolorlist.length)]
    });
});

每次页面加载时，它都会从列表中选择一种随机颜色并将其设置在正文的 css 上。

于 2012-11-29T12:13:51.130 回答
0

通过使用纯 JS：

window.onload = function(){
    var arr = document.querySelectorAll(".three");
    for(var i=0;i<arr.length;i++){
         arr[i].style.background = bgcolorlist[Math.floor(Math.random()*bgcolorlist.length)]
    }
}

这将为所有具有三类随机颜色的 div 提供。如果您希望所有内容都相同，只需将 math.random 缓存到变量中

于 2012-11-29T12:19:09.250 回答