使用 CSS 或 js 突出显示当前链接

【问题标题】：Highlight current link with CSS or js使用 CSS 或 js 突出显示当前链接
【发布时间】：2014-11-23 04:50:36
【问题描述】：

我对突出显示打开的链接有一个小问题。所以我想要什么：如果页面加载，它会打开足球（链接）类别：

<script type="text/javascript">
       var x = location.hash.replace("#", "");
       if (x===""){
         window.location.href = "#football";
        }
</script>

我想在页面加载时自动突出显示该类别（更改当前链接的颜色）。在（某人）单击其他类别（链接）后突出显示当前类别。例如，与其他链接一样具有其他颜色。需要更好地在页面上定位。我创建了 JSFiddle 示例 here。

【问题讨论】：

为什么不使用服务器端脚本？

标签： javascript html css highlight

【解决方案1】：

我相信这是你需要的：

为当前类别的文档加载设置颜色：

$('#link-' + hashStr).css({
     'color': 'red'
});

在点击类别时改变颜色：

$('.nav1').css({'color': 'black'});
$('#link-' + hashStr).css({'color': 'red'});

请注意，我更新了其中一个导航链接，因此它们都具有相同的类：

<li><a class="nav1" data-tab="#hockey" id="link-hockey"href="#hockey">Hockey</a></li>

updated fiddle

【讨论】：

你只需要$("#link-"+hashStr).css("color","red")。