jquery - 选择所有孩子并分配随机背景颜色

Question

我正在尝试选择子节点并随机更改每个 div 的背景颜色，以便我可以快速查看页面是如何分解的。我找到了一个不错的小脚本来生成十六进制，但正在努力将其应用于选定的 divs 。

这将返回十六进制值：

function random_color() {
var letters = '0123456789ABCDEF'.split('');
var color = '#';
for (var i = 0; i < 6; i++ ) {
    color += letters[Math.round(Math.random() * 15)];
}
return color;
};

这不是循环遍历孩子并分配随机值。

function loop(){
children = $("#container").children();
$(children).each(function(){
    $(this).css("background-color", random_color());
   }    
};

loop();

只是想我会把这个扔出去。

先感谢您。

Answer 1

你不需要$，children因为它已经是一个 jquery 对象

children.each(function(){
  $(this).css("background-color", random_color());
 });
//^^---here    
};

)并注意到您在每个...中都错过了一个右括号

Answer 2

children已经包含所有子元素..

所以使用：

function loop(){
children = $("#container").children();
children.each(function(){                  //<----  children instead of $(children)
   $(this).css("background-color", random_color());
 });    
};

Answer 3

试试这个

$("#container").children().each(function() {      

     var letters = '0123456789ABCDEF'.split('');
     var color = '#';
      for (var i = 0; i < 6; i++ ) 
       color += letters[Math.round(Math.random() * 15)];
        $(this).css("background-color", color);

});

或者

$("#container").children().each(function() { 
        $(this).css("background-color", random_color());   
});

或者

 children.each(function(){
 $(this).css("background-color", random_color());
});

Answer 4

.children()已经返回一个 jquery 对象，因此请替换以下行：

$(children).each(function(){

对于这个：

children.each(function(){

Answer 5

首先...您可以只使用 children.each 而无需包装 $()。其次...你的 div 样式了吗？我的意思是，他们有 with's 和 height's 吗？