如何在没有图像和via属性的情况下计算jquery中的li

时间:2015-09-18 03:36:11

标签: javascript jquery html

我有这个代码。

我有3 li。 。我如何计算没有图像的li和div风格的颜色是#c9c9c9?

在我的情况下我有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);

2 个答案:

答案 0 :(得分:4)

检查颜色样式是个问题,要让li没有图像,您可以使用nothas()之类的

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>

答案 1 :(得分:0)

尝试使用is()var li = $("#room_1 li").filter(function() { return $("> div[style=color\\:#c9c9c9]", this).is(function() { return !$("img", this).is("*") }) }) console.log(li.html(), li.length)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.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>
openFileDialog