gpt4 book ai didi

javascript - 使用 CSS 更改当前页面的链接颜色

转载 作者:行者123 更新时间:2023-11-28 09:35:58 25 4
gpt4 key购买 nike

当前页面的一种样式链接与其他样式有何不同?我想交换文本和背景的颜色。

HTML:

<ul id="navigation">
<li class="a"><a href="/">Home</a></li>
<li class="b"><a href="theatre.php">Theatre</a></li>
<li class="c"><a href="programming.php">Programming</a></li>
</ul>

CSS:

li a{
color:#A60500;
}

li a:hover{
color:#640200;
background-color:#000000;
}

最佳答案

使用 jQuery,您可以使用 .each 函数通过以下代码循环访问链接:

$(document).ready(function() {
$("[href]").each(function() {
if (this.href == window.location.href) {
$(this).addClass("active");
}
});
});

根据您的页面结构和使用的链接,您可能需要缩小链接的选择范围,例如:

$("nav [href]").each ...

如果您使用的是 URL 参数,则可能需要去除这些参数:

if (this.href.split("?")[0] == window.location.href.split("?")[0]) ...

这样您就不必编辑每个页面。

关于javascript - 使用 CSS 更改当前页面的链接颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25528144/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com