jQuery：如何查找具有特定类的子元素？

Question

我想知道如何确定一个 ul 元素是否有不少于 2 个子元素，并且在该 ul 元素中是否存在两个特定类别的子元素 ...

if($(this).children().length > 2 && $(this).children('.section-title, .active')) {
    $(this).append('<li class="dots">&hellip;</li>');
}

???

- matt

---

没有完全理解标准的第二部分。您是在说您想知道这两个类是否在ul中吗？ - spinon

我认为他想看看这两个 ul 是否具有不同的类。 - Coronier

是的！确切地说，我想知道是否有超过两个子元素（li），并且这些子元素中是否有两个带有指定类名的li。因此，如果ul内恰好有3个li，则其中一个必须是具有“section-title”类的li，另一个必须具有“active”类名！ - matt

你能否编辑一下问题，让它更加清晰明了？例如像spinon的项目列表那样。此外，你可能还想给这个问题打上“javascript”的标签。 - Lèse majesté

Answer 1

var $ul = $('ul');
if($ul.find("li").length > 2 && $ul.find('.active, .inactive').length  == 2) {
       alert('yes, it is this way');
}​

<ul>
  <li class="active">Whatever</li>
  <li class="inactive">Whatever</li>
  <li>Whatever</li>
  <li>Whatever</li>
</ul>​

Demo: http://jsfiddle.net/RtTSM/1/

- karim79

Answer 2

var ulChildren = $("li", this);
if (ulChildren.length > 2 && $('li.section-title', ulChildren).length >= 1 && $('li.active', ulChildren).length >= 1)

这将检查以下规则：

1. 在ul下有两个以上的li元素
2. 至少有一个带有section-title类的li
3. 至少有一个带有active类的li

- spinon

---

如果一个 ul 元素中有三个 li 元素，那么至少其中两个必须具有所提到的类名。因此，必须满足所有三个条件。 - matt

好的，那让我稍微修改一下我的答案，因为这并不完全正确。上面的答案接近正确，但如果 ul 中有 3 个活动 li 成员且没有 section-title，它也会通过，而这似乎不是你想要的。所以让我改一下，确保至少有一个 section-title 和一个活动成员。 - spinon

为什么不直接使用 var ulChildren = $(this).children('li')？顺便提一下，你漏了引号。而且可能应该是 ulChildren.length > 2。 - Felix Kling

是的，发现得好，我漏了引号。为什么要使用.children，而不只是选择器来获取子元素呢？它具有相同的效果，除了这只会提取作为子元素的li对象。显然，在ul中几乎没有机会存在任何子元素。但是在div中，您可以拥有各种不同的元素作为子元素，这样您就可以限制为所需的标签。 - spinon

Answer 3

var ul = $('#ul_id');
if ($('.class1, .class2', ul).size()>2)

你不需要测试第一个条件（有超过2个孩子），因为它是一个“AND”条件，如果第二个条件满足，第一个条件就是平凡的。

詹姆斯·林

[e-mail]

- James Lin