选择具有特定背景颜色的元素

28 css jquery jquery-selectors

我想spandivCSS中包含特定背景颜色的一堆s .我该如何实现这一目标?

Owe*_*wen 44

如果我正确理解了问题,选择器[attribute=value] 将无法工作,因为<span>它不包含属性"background-color".你可以快速测试,以确认它不匹配任何东西:

$('#someDiv span[background-color]').size(); // returns 0
Run Code Online (Sandbox Code Playgroud)

给定:

.one, .two {
  background-color: black;
}

.three {
  background-color: red;
}
Run Code Online (Sandbox Code Playgroud)

这是一个可行的片段:

$('div#someDiv span').filter(function() {
    var match = 'rgb(0, 0, 0)'; // match background-color: black
    /*
        true = keep this element in our wrapped set
        false = remove this element from our wrapped set
                                                         */
    return ( $(this).css('background-color') == match );

}).css('background-color', 'green'); // change background color of all black spans
Run Code Online (Sandbox Code Playgroud)
.one, .two {
  background-color: black;
}

.three {
  background-color: red;
}
Run Code Online (Sandbox Code Playgroud)
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>

<div id="someDiv">
    <span class="one">test one</span>
    <span class="two">test two</span>
    <span class="three">test three</span>
</div>
Run Code Online (Sandbox Code Playgroud)