如果URL具有/ directory / listing，则将活动类添加到菜单“parent”项

Question

当URL包含目录路径时，尝试将CS​​S类添加到父项。

例如，如果我的网址是

example.com/directory/about.html

我想在我的顶部导航中添加一个CSS类，如果它包含/directory/的话。

所以在这种情况下，example.com/directory/overview.html会得到一个CSS类“active-parent”

这将是.main-nav li a.active-parent

（请注意，我已经使用jquery来检查网址并使该页面处于活动状态，但是当它是一个部分的子页面时，父节点不会突出显示）

我以为我可以使用:contains() Selector，但我不知道如何将其应用到网址

Answer 1

jQuery选择器不能在url上使用。您必须解析网址并自行检查内容。

if (window.location.href.indexOf('/directory/') != -1) {
    // Add a css class to a html element
}

您可能希望使用拆分功能以更通用的方式：

window.location.pathname.split('/').forEach(function(directory) {
    if (directory == 'directory') {
        // Add a css class to a html element
    }
});

Answer 2

如果我理解正确，您希望过滤一组网址，然后根据href中的文字，您想要操纵数据。在这种情况下，请使用.filter()函数，如下所示：

$("a").filter(function(i) { return $(this).attr("href").indexOf("document") > -1; })

这个抓取所有 A标记元素，使用里面的函数过滤它们，以确定href中是否包含“文档”。然后只需使用.each()函数执行任何操作，如下所示：

$("a")
    .filter(function(i) { return this.href.indexOf("document") > -1; })
    .each(function(i) {
        $(this).parent().addClass("some-class-name");
    });

See jsFiddle Example

如果您需要更多的理解，请发表评论。

Answer 3

基于有限的信息，我建议：

$('a').filter(
    function(){
        return this.href.match(/(\/\w+\/)/);
    }).parent().addClass('parent');

如果href包含任何目录，而不仅仅是名为'目录'的特定目录

，则假设已添加该类。

参考文献：

• match()。
• Regular expressions in JavaScript。