javascript - 如何在没有图像和通过属性的情况下在jquery中计算li

Question

我有这个代码。 .

我有 3 个 li 。 .我如何计算没有图像和 div 样式颜色为#c9c9c9 的li？

在我的例子中，我有 1 个没有图像的 li，div 样式颜色是 #c9c9c9

所以输出应该是1

我不知道这是否可能。

这是我的代码:

<ul id="room_1">
        <li>
            <div class="wrap participantlist wrap_body" style="color:#000000">
                <img src="images/leader.png">
            </div>
        </li>
        <li>
            <div class="wrap participantlist wrap_body" style="color:#c9c9c9">
            </div>
         </li>
         <li>
            <div class="wrap participantlist wrap_body" style="color:#000000">
            </div>
         </li>
    </ul>

这是我的js:

alert($("ul li .wrap_body").length);

Answer 1

检查颜色样式是一个问题，要获得没有图像的 li，您可以使用 not和 has()喜欢

var $liswoimg = $('li').not(':has(img)');
snippet.log($liswoimg.length)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>

<ul id="room_1">
  <li>
    <div class="wrap participantlist wrap_body" style="color:#000000">
      <img src="images/leader.png">
    </div>
  </li>
  <li>
    <div class="wrap participantlist wrap_body" style="color:#c9c9c9"></div>
  </li>
  <li>
    <div class="wrap participantlist wrap_body" style="color:#000000"></div>
  </li>
</ul>

但是如果可以使用style属性值的话

var $liswoimg = $('li:has(div[style="color:#c9c9c9"])').not(':has(img)');
snippet.log($liswoimg.length)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>

<ul id="room_1">
  <li>
    <div class="wrap participantlist wrap_body" style="color:#000000">
      <img src="images/leader.png">
    </div>
  </li>
  <li>
    <div class="wrap participantlist wrap_body" style="color:#c9c9c9"></div>
  </li>
  <li>
    <div class="wrap participantlist wrap_body" style="color:#000000"></div>
  </li>
</ul>