Question

我有这部分HTML：

<div id="menu">
    <ul>
        <li><a href="/">Startseite</a></li>
        <li class="active"><a href="/pacmodule/glass">Brillengl&#228;ser</a></li>
        <li><a href="/pacmodule/completeglass">Komplettbrille</a></li>
        <li><a href="/t/Comingsoon">Sportbrillen</a></li>
        <li><a href="/PacCategoryRedirect/0">Marketing</a></li>
        <li><a href="/customer/statistics">Statistik</a></li>
     </ul>
</div>

我想删除class =“active”参数并将其设置在li标签中，其中我有href =“/ pacmodule / completeglass”属性。

第一部分我用jquery成功完成了：

$("#menu").find("ul:first").find(".active").removeClass("active");

但是我的第二部分有问题。这只选择一个标签：

$('a[href="/pacmodule/completeglass"]').parent().html();

这就是所有ul标签：

$('a[href="/pacmodule/completeglass"]').parent().parent().html();

如何在li标签中设置class =“active”属性，其中href =“/ pacmodule / completeglass”

感谢您的帮助。

Answer 1

您不需要html()来电。他们只是将innerHTML作为字符串返回。您可能希望返回outerHTML（对于outerHTML使用类似...parent()[0].outerHTML的内容）

试试这个：

$('a[href="/pacmodule/completeglass"]').closest('li').addClass('active');

它将根据href =“/ pacmodule / completeglass”找到锚点，然后找到最近的LI祖先，然后将类active添加到其中。

closest是查找特定类型祖先的最有用方法。这比使用parent()更好，因为closest可以应对HTML结构的变化。

注意：如果您解释总体目标，可能有更好的方法来搜索链接href ：）

<强>更新

您不希望删除之前的选择，因为它太具体了：

$("#menu").find("ul:first").find(".active").removeClass("active");

试试这个：

$("#menu li.active").removeClass("active");

Answer 2

$("#menu").find("ul:first").find(".active").removeClass("active");

这可以更有效地写作：

$("#menu").find("li.active").removeClass("active");

然后DOM不需要搜索任何ul，而是直接进入类.active

Answer 3

.closest()

$("li").removeClass("active").find($('a[href="/pacmodule/completeglass"]')).closest('li').addClass('active');

DEMO

Answer 4

轻松完成此操作（进入您的js文档）：

$("#menu li").removeClass("active");
$('a[href="/pacmodule/completeglass"]').parent().addClass("active");

Answer 5

你为什么不试试这个：

$("#menu").find("ul:first").find(".active").removeClass("active");
$('a[href="/pacmodule/completeglass"]').parent().addClass("active");

您可能需要查看此fiddle

如何获得父元素？

5 个答案: