Question

哦，男孩 - 这对你们来说很容易（不幸的是，当涉及到JS时，我是一个新手）。我真的很感谢你的帮助！谢谢！

这是我的代码：

jQuery(document).ready(function( $ ){
var colors = ['#e5e5e5','#d3f2eb','#cce3ff', '#97d8c9', '#97e9c4', '#c9f9b2', '#c1d4d5', '#b2d5fd', '#fdebb2', '#5cc2ab', '#5cdca2', '#aaf587', '#9ebbbe', '#87bdfc', '#fce086'];
var random_color = colors[Math.floor(Math.random() * colors.length)];
$('.bannercolor').css('background-color', random_color);
});

<div class="bannercolor">Div ONE</div>
<div class="bannercolor">Div TWO</div>
<div class="bannercolor">Div THREE</div>

jquery将相同的背景颜色应用于我页面上的所有三个div。我想要的是从每个div的数组中选择不同的颜色。 Div One可能是蓝色的...... div可能是绿色等等。

你能帮助我弄清楚如何修改我的代码来实现这个目标吗？

Answer 1

如果要根据该类设置颜色，则需要为每个div使用不同的类。或者，迭代类中的元素并将css分配给“this”。您还需要获取颜色并为每个div设置它（即三次）。

这是一个例子，我们迭代类中的元素并为每个元素分配背景颜色。

jQuery(document).ready(function($) {
  var colors = ['#e5e5e5', '#d3f2eb', '#cce3ff', '#97d8c9', '#97e9c4', '#c9f9b2', '#c1d4d5', '#b2d5fd', '#fdebb2', '#5cc2ab', '#5cdca2', '#aaf587', '#9ebbbe', '#87bdfc', '#fce086'];

  $('.bannercolor').each(function() {
    var random_color = colors[Math.floor(Math.random() * colors.length)];
    $(this).css('background-color', random_color);
  });
});

jquery - 将新实例应用于每个css类实例

1 个答案: