Html 导航菜单中突出显示的锚点

我有一个WordPress系统。问题是我的导航菜单。 我有一个指向菜单中某个子网站的链接和一个指向主站点的锚定点。
因此，如果我像这样链接锚点：

#test

它在主站点上工作。如果我想在子网站上单击此按钮，它将不起作用

如果我像这样链接锚点：

http://localhost/#test

它在子站点上工作

但在主页上，锚是突出显示的。我知道这是因为它是当前的菜单项，但我不希望它突出显示。我可以将当前的菜单项设置为普通颜色

但我希望活动链接高亮显示

我对答案的想法是，也许我会这样链接：

#test

，然后我将链接重定向到：

http://localhost/#test

但如果有另一个解决方案就好了。 我在www上找不到关于这个主题的东西。如果有人有一个好的文档，那就太好了

---

谢谢您的帮助：）

如果您这样使用它：

#测试

它是指当前访问站点上的锚

因此，对于主站点，它将是
你的网站.tld/#test

在子网站上，它将是
你的网站。tld/subset/#test

非常不同的事情

使用完整链接，使菜单始终指向相同部分的信息

如果不想突出显示完整链接，则可能需要使用JavaScript

例如，您可以使用锚定标记将类添加到所有菜单链接中，并去除突出显示效果。

---

或者，您可以将每个菜单链接与url栏中的当前url进行比较-如果这不是一个完美匹配-添加一个类/或添加一个完美匹配的类。

因此，我找到了一个解决方案。我添加了一些JS来删除添加高亮效果的CSS类

因此，这是完美的工作。一开始有点困难，因为我无法使用

getElementsByClassName

选择菜单项。但是使用querySelector，它工作得很好

JS代码如下所示：
对于第一个锚点：

document.querySelector("#menu-navigation-de-1 > li.menu-item.menu-item-type-custom.menu-item-object-custom.current-menu-item.current_page_item.menu-item-home.menu-item-49874.nav-item").classList.remove("current-menu-item");

对于第二个锚点：

document.querySelector("#menu-navigation-de-1 > li.menu-item.menu-item-type-custom.menu-item-object-custom.current-menu-item.current_page_item.menu-item-home.menu-item-300.nav-item").classList.remove("current-menu-item"); 

---

谢谢你@ibes，你帮助了我。：）

移除散列“#”标记，然后重试。#是锚定点。如果我不使用它，它就是一个指向不存在的站点的链接。谢谢你的帮助！我已经想过这样的事情了。我在JS方面有问题，所以如果你能帮我一点忙就好了。第一个问题是，你想使用哪个根？我认为最干净的方法是在菜单链接上放置一个与当前url完全匹配的类。然后我建议扩展当前CSS规则，突出显示当前活动选项卡，如果没有执行JS，则保持一切不变，如果JS不活动，则减少突出显示-听起来不错？您是否使用纯JS或jQuery？您需要的是：-在页面完成加载DOM后（文档准备就绪）-获取特定菜单中的所有链接（通过选择器获取元素）-获取地址栏中的当前url（类似于window.location）-对于每个链接，将href属性与当前url进行比较-如果存在匹配项，则在每次有人浏览您的站点时页面刷新时向其添加一个类。您只需在页面加载时执行一次，以后无需更改内容（抱歉-我不能换行？！）