Question

我想找到合适的CSS或jQuery选择器来编辑background-color，它是内联定义的。 HTML看起来像这样：

<div id="rev_slider_3_1">
    <ul style="Something">
       <li style="Something">
           <div class="slotholder">
               <div class="tp-bgimg" style="background-color: for example blue"></div>
           </div>
       </li>
       <li style="Something">
           <div class="slotholder">
               <div  class="tp-bgimg" style="background-color: for example red"></div>
           </div>
       </li>
       ...(A few more li's)
     </ul>
</div>

如果有人可以告诉我正确的CSS或jQuery选择器来单独更改background-color 的<div> ，我想要替换{{ {1}}是。

因为它是一个插件，我当然无法改变HTML。

background-color

更新

我想要更改。$("The Css Selector I'm searching for").css("background-color")背景颜色，但是有多个tp-bgimg并且他们需要获得不同的.tp-bgimg，所以我想要一个jQuery选择器让它我单独更改了例如第一个background-color .tp-bgimg。我需要替换颜色。

Answer 1

要单独控制每个div，最好使用jQuery .each()。所以你可以使用这样的代码：

$('.tp-bgimg').each(function(i,e){// i==>is the index of element, e==> the element itself
    $(e).css('background-color','yellow');
});

的更新 的

如果你想给每个div一个新颜色，那么我们有两个解决方案：

在each内的每个循环中生成随机颜色，为每个.tp-bgimg颜色分配。==＆gt;的 DEMO

将一组预定义的颜色作为颜色数组，并在每个循环中再次分配给每个.tp-bgimg颜色，但在这里您需要知道您拥有多少.tp-bgimg所以您可以拥有正确的相应颜色颜色数量。 ==＆GT;的 DEMO

Answer 2

您似乎想要使用$(".tp-bgimg")，但不仅如此。你似乎也想要这个：

http://api.jquery.com/each/

修正并制作了一个小提琴：http://jsfiddle.net/digitalextremist/C4UK3

所以，然后逐个通过这样的元素，并根据需要修改每个元素：

$( document ).ready( function() { 
    var colors = [ "#f00", "#00f", "#0f0" ]
    var i = 0
    $(".tp-bgimg").each(function() {
        if( i >= colors.length ) {
            i = 0
        }
        $(this).css("background-color", colors[i++])
        console.log( colors[i] )
    });
})

正如您将看到的，我根据您的喜好添加了交替背景颜色的代码。

请参阅：

alternating colors

Answer 3

jquery :eq() selector符合您的需求。

示例：

$('li:eq(0) .tp-bgimg').css('background-color','blue');

将更改第一个 .tp-bgimg元素中div li的bgcolor（第一个被索引为0，第二个为1，依此类推）

这样你可以单独改变一个li的颜色，但你必须知道它是第一个，第二个等。

<强>更新

这是一个DEMO，向您展示如何以不同的颜色单独更改它们。

jQuery遍历（找到正确的CSS选择器），并交替背景颜色

3 个答案: