用于在现有标题菜单中更改bg颜色的JavaScript代码

Question

我希望我的标题在重定向到网站的另一页时更改背景颜色。现在，背景颜色仅应用于我的“主页”页面（下面的HTML代码）。菜单应如下所示：

我没有JavaScript经验，但是对此进行了一些研究。我尝试过使用if，if，if，if，if，if，if，if，else，if，if，if，if，if，if，if，if，if，if，if，if，if，if，if，if，if，if，if，if，if，if，if，if，if，if，if，if通过其他方式使用W3Schools中的示例更改颜色：

<p id="p2">example</p>
<script>
document.getElementById("p2").style.color = "grey";
</script>

不幸的是，这些都不起作用，我也不知道我需要使用哪些对象/功能。

这是我上面已经在HTML中显示的标题菜单的一部分：

<ul class="navigationboxL">
    <li><a class="aktuell" title="Home" href="http://ten.nis">| Home</a></li>
    <li><a title="Angebote" href="http://ten.nis/?page_id=29">| Angebote</a></li>
    <li><a title="Sponsoring" href="http://ten.nis/?page_id=31">| Sponsoring</a></li>
</ul>

以下是CSS：https://www.promotennis.ch/StyleSheet.css。

任何帮助或建议都将受到赞赏。

Answer 1

您不需要任何JS，您应该仅使用CSS进行此操作。我认为，活动元素的样式是通过aktuell类完成的。

因此，要将另一个元素设置为活动元素，只需从该元素中删除class="aktuell"并将其添加到活动元素中：

<ul class="navigationboxL">
  <li><a title="Home" href="http://ten.nis">| Home</a></li>
  <li><a class="aktuell" title="Angebote" href="http://ten.nis/?page_id=29">| Angebote</a></li>
  <li><a title="Sponsoring" href="http://ten.nis/?page_id=31">| Sponsoring</a></li>
</ul>

另一个小技巧：您可以|仅使用CSS，现在做的就是添加文本。您可以使用border-left: 1px solid black（或所需的任何颜色）来实现。然后删除第一个元素的左边框。