如何使用jQuery将<c>类添加到包含给定ID的<li>元素？</li>

Question

我想将一个活动类添加到ID所在的<li>，例如：

<li><a href="" id="foo">text</a></li>

如何向<li>所在的#foo添加课程？

Answer 1

$('#foo').parent('li').addClass("yourclass")

Answer 2

$("#foo").closest("li").addClass("bar");

如果您的<a>标记可能包含在其他元素中，而不是<li>的直接子代，则parent('li')将不起作用：

http://jsfiddle.net/PMfVK/

HTML

<ul>
    <li><div><a id="foo">Foo</a></div></li>
    <li><div><a id="bar">Bar</a></div></li>
</ul>​

JS

$("#foo").closest("li").addClass("foo"); // this will correctly grab the li
$("#bar").parent("li").addClass("bar");​  // this will grab nothing

Answer 3

$('#foo').parent('li').addClass('active');

Answer 4

$("li").has("#foo").addClass("yourclass")

Answer 5

首先使用the ID selector选择ID为foo的元素。然后，使用.parents选择该元素的<li>父级。使用.eq(0)确保只找到最近的父级。最后，使用addClass将类添加到<li>元素。

由于我们使用父 s ，即使具有foo ID的元素嵌套在<li>下面的几个元素，它仍然会被选中。

$("#foo").parents("li").eq(0).addClass("bar");​​

See my example on jsFiddle.

Answer 6

$('a[id]').closest('li').addClass('active');

demo