获取具有特定类的子元素的父元素

Question

我有一个像这样的嵌套菜单：

<ul id="menu">
    <li>Home
        <ul>
            <li>New</li>
            <li class="selected">Open</li>
            <li>Folder</li>
        </ul>
    </li>
    <li>Another menu
        <ul>
            <li>submenu item 1</li>
            <li>submenu item 2</li>
            <li>submenu item 3</li>
        </ul>
    </li>
</ul>

现在我正在尝试更改第一个LI元素（包含主页的那个）的类，因为它有一个带有“selected”类的子元素。使用jQuery可以实现吗？

- jao

Answer 1

更快更精确的捕捉目标方法。

$("li.selected").parents("#menu").addClass('foo');

更新以为第一个li子元素添加一些类。

$("li.selected").parents("#menu").addClass('foo').find('li:first').addClass('bar');

我还建议阅读jQuery 遍历 文档。

- Elzo Valugi

---

我想给<li>Home添加一个CSS类。我该怎么做？ - jao

如果您在“另一个菜单”中选择了任何<li>，则这将无法正常工作。 - Mottie

Answer 2

你可以使用这个语法来完成这个操作。

$('.selected').parent().parent().addClass('foo').removeClass('bar');

- Niels Bom

---

最好使用 .parents() 选择器。 - eozzy

我不太清楚它为什么更好，你能给个例子吗？ - Niels Bom

Answer 3

尝试

$('li.selected').parent().closest('li').addClass('foo');

编辑：抱歉，仅使用closest将使其自身成为目标。

或者您可以使用：

$('li.selected').closest('li:not(".selected")').addClass('foo');

- Mottie