理解jQuery中的not()函数

时间:2014-01-31 19:33:51

标签: jquery

我不明白为什么我仍然使用红色背景获取元素<li class=".item-2">。 请查看我的代码并向我提供一些提示。

<ul class="level-1">
    <li class="item-i">I</li>
    <li class="item-ii">II
        <ul class="level-2">
            <li class="item-a">A</li>
            <li class="item-b">B
                <ul class="level-3">
                    <li class="item-1">1</li>
                    <li class="item-2">2 .item-2</li>
                    <li class="item-3">3</li>
                </ul>
            </li>
            <li class="item-c">C</li>
        </ul>
    </li>
    <li class="item-iii">III</li>
</ul>

$("li.item-ii").find('li').not($(".item-2")).css("background-color", "red");

的jsfiddle: http://jsfiddle.net/k3cqS/1/

1 个答案:

答案 0 :(得分:2)

find('li')也匹配父LI,因此当父母有红色背景时,排除孩子并不重要。

你最终得到了这个

<ul class="level-1">
    <li class="item-i">I</li>
    <li class="item-ii">II
        <ul class="level-2">
            <li class="item-a" style="background-color: red;">A</li>

            <!-- The below element is red, and is the parent element -->
            <li class="item-b" style="background-color: red;">B
                <ul class="level-3">
                    <li class="item-1" style="background-color: red;">1</li>

                    <!-- so it doesn't matter if this isn't red -->
                    <li class="item-2">2 .item-2</li>
                    <li class="item-3" style="background-color: red;">3</li>
                </ul>
            </li>
            <li class="item-c" style="background-color: red;">C</li>
        </ul>
    </li>
    <li class="item-iii">III</li>
</ul>

.item-2实际上是透明的,因此父母背景正在显示。