如何使用 jquery 选择父元素的兄弟？

Question

我正在尝试使用 jquery 来专门选择具有相同 .代码是这样的：

HTML

    <div class="cool-check-list">
        <ul>
        <li>
            <label>
                <span class="icon"></span> <!-- trying to select this -->
                Awesome Label Name
            </label>

            <ul>
                <li>
                    <label>
                        <span class="icon"></span> <!-- clicking this toggles the class of the above icon class -->
                        Awesome Label Name 2
                    </label>    
                </li>                        
            </ul>
        </li>
        </ul>
   </div>

JQUERY

    $('.icon', '.cool-check-list').click( function(e){

    $(this).parent('li label .icon').toggleClass('icon-alternate');

    });

Answer 1

假设您已经获得了对单击范围的引用，您可以这样做：

$(this).closest("ul").siblings().find(".icon")

其中this 是您点击的span。 closest 获取与选择器匹配的最近的祖先。

Answer 2

您应该更准确地告诉我们您想选择什么以及您尝试了什么。

无论如何，你可以使用jquery的parents()函数，例如：

$(".icon").parents("li")

将选择 每个节点 li 'before' DOM 中的类图标。

顺便说一句，注意 parents 和 parent 之间的区别 - 引用 jquery 文档：

.parents() 和 .parent() 方法 是相似的，除了后者 只在 DOM 上向上移动一层 树。