javascript - 如何在每个页面上动态突出显示菜单项?

标签 javascript jquery html

我有一个 page header.html,我将其用作每个网页的标题。我的标题中有菜单项。我想使用 javascript/jquery 动态突出显示当前网页菜单。谁能帮帮我吗?

HTML:

<ul class="navigation">
<li class="highlight"><a href="index.html" class="highlight">Home</a></li>
<li><a href="subnet.html">IP Discovery and Password Management</a></li>
<li><a href="test_management.html">Test Management</a></li>
<li><a href="test_dut.cgi">DUT Management</a></li>
<li><a href="test_execmain.cgi">Test Execution</a></li>
<li><a href="result.cgi">Results</a></li>
</ul>

最佳答案

首先使用window.location和正则表达式找到页面

jQuery(function($){
    var page = window.location.href.match(/[^/]+$/)[0];
    $('.navigation li a[href="' + page + '"]').parent().addBack().addClass('highlight')
})

关于javascript - 如何在每个页面上动态突出显示菜单项?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21673677/

相关文章:

html - 在不剪切 div 的情况下打印网页

javascript - Meteor 删除对象数组中的重复属性

javascript - 你如何在 node.js 中共享 EventEmitter?

html - JQuery,如何让div在点击其中任意位置时消失?

javascript - 删除 beforeunload 的事件监听器

javascript - 遍历 JSON - 特殊方式

javascript - 从 Ajax 调用 PHP 函数

javascript - 如何检查 jQuery 插件中是否存在某个元素?

php - 如何在php mysql中显示依赖于下拉子类别的父类别

html - CSS 中图像之间的样式分隔符链接