jQuery只找到嵌套元素

Question

鉴于此HTML结构

<div class="item">
    <div class="item">
        select me
        <div class="item">don't select me</div>
    </div>
    <span>
        <div class="item">select me</div>
    </span>
</div>

而这个jQuery:

var firstItem = $('.item:first');
var selector = firstItem.find('.item');
selector.css('color', 'red');

我正在寻找一种方法来只标记firstItem div中没有​​嵌套的.item元素.这里棘手的部分是firstItem本身(或可以)已经嵌套在.item类中.

---

我试过了什么？

firstItem.find('.item').not('.item .item')

这不起作用,因为我们开始的第一级已经是.item类.这可以嵌套x次,所以它可以是.item .item .item .item或者其他什么.并且起始元素没有ID,所以我也不能在选择器中使用它.

---

我认为解决方案应该是类似于反向的.closest(),它沿着DOM移动并且不搜索已经找到的项目的内容.

在这里准备了一个jsFiddle:http://jsfiddle.net/LWmy3/2/

Answer 1

.item选择第一个嵌套及其兄弟姐妹怎么样？

我在这里更新了小提琴：http://jsfiddle.net/LWmy3/3/使用红色边框而不是红色文本来表明它没有选择“不要选择我”项目。

编辑：使用each()

http://jsfiddle.net/LWmy3/5/