2个div上的随机预定义背景颜色和文本颜色
我期待创建一个Jquery脚本，它将从10的列表中随机选择一种颜色，然后将其作为背景颜色应用于一个div，以及h1标签的颜色。
到目前为止，我有这个随机颜色：
$(document).ready(function() { var hue = 'rgb(' + (Math.floor((256-199)*Math.random()) + 200) + ',' + (Math.floor((256-199)*Math.random()) + 200) + ',' + (Math.floor((256-199)*Math.random()) + 200) + ')'; $('#controls-wrapper').css("background-color", hue); $('h1').css("color", hue);}); 但是如何从10种颜色的列表中随机选择呢？ 我找到了这个，但不知道如何将它应用于bg color div和h1标签。
$("#controls-wrapper").each(function(){ var colors = ["#CCCCCC","#333333","#990099"]; var rand = Math.floor(Math.random()*colors.length); $(this).css("background-color", colors[rand]);});
我想你想要完成的是：
假设您有一个这样的HTML页面：
Hello World!
创建颜色数组后，您将获得与颜色索引对应的随机数。
现在您有一个随机索引，您可以使用它来设置对象的背景颜色或文本颜色。
如果您希望每种颜色都不同，那么您只需要打电话
rand = Math.floor(Math.random()*colors.length);
再次设置下一个元素的颜色之前。
最后通过调用$('h1').css("color", colors[rand]); 你将在页面上的所有H1元素上设置颜色，你希望它在H1上特定设置ID或类值，然后使用$('h1.myclass').css("color", colors[rand]); OR $('#ID_for_my_H1').css("color", colors[rand]);
可能这可以帮助：
改变DIV的颜色
这是我使用的方法概述的代码的JS！ JS：
setInterval(function () { document.getElementById("fancy").style.background= '#'+Math.floor(Math.random()*16777215).toString(16); document.body.style.background= '#'+Math.floor(Math.random()*16777215).toString(16); }, 1000);
虽然这个post有点旧，但它可能在这个问题的背景下有一些用处!!
.random-color { display: block; margin-bottom: 10px; width: 150px; color:#CC00CC; } Link 1 Link 2 Link 3 Link 4 Link 5 var randomLinks = $('a.random-color'); var original = randomLinks.css('color'); var colors = ["#CCCCCC","#333333","#990099", "#1295A6", "#FFFF99"]; randomLinks.hover(function() { //mouseover var col = Math.floor(Math.random()*colors.length); $(this).css('color',colors[col]); $(this).animate({ 'paddingLeft': '20px' }, 1000); }, function() { //mouseout $(this).css('color',original); $(this).animate({ 'paddingLeft': '0' }, 500); });
请使用链接http://codebins.com/codes/home/4ldqpby尝试此操作
var array = ["orange", "blue", "black", "yellow", "green"]; var colorNumber = Math.round((Math.random() * (array.length - 1))); $("body").css('background-color', array[colorNumber]);