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

Posted 2023-02-25

【中文标题】如何使用 jquery 选择父元素的兄弟？

【英文标题】：How do I use jquery to select a sibling of the parent element?

【发布时间】：2011-06-23 14:11:16

【问题描述】：

我正在尝试使用 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');

    );

【问题讨论】：

每次点击最后一个图标时，我都想切换第一个图标进行更改

【参考方案1】：

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

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

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

【参考方案2】：

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

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

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

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

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

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

【讨论】：

谢谢，我更新了上面的原帖。有些东西不工作

感谢大家的帮助！

不客气。如果 kingiv 的回答符合您的要求，请不要忘记接受他的回答！