jquery/js当前URL对当前栏目高亮突出显示
html:
1 <div class="nav"> 2 <ul> 3 <li><a href="index.html">首 页</a></li> 4 <li><a href="b.html">专家观点</a></li> 5 <li><a href="c.html">课题研讨</a></li> 6 <li><a href="d.html">研究报告</a></li> 7 </ul> 8 </div><!--/.nav-->
jquery:
1 //除了首页外当前URL对当前栏目高亮突出显示 2 $(".nav li a:not(:first)").each(function(){ 3 $this = $(this); 4 if($this[0].href==String(window.location)){ 5 $this.parent().addClass("selected"); 6 } 7 }); 8 //当前URL对当前栏目高亮突出显示 9 $(".sidenav li a").each(function(){ 10 $this = $(this); 11 if($this[0].href==String(window.location)){ 12 $this.parent().addClass("selected"); 13 } 14 });
或者原生js:
1 //js 当前URL对当前栏目高亮突出显示 2 var myNav = document.getElementById("nav").getElementsByTagName("a"); 3 for(var i=0;i<myNav.length;i++){ 4 var links = myNav[i].getAttribute("href"); 5 var myURL = document.location.href; 6 if(myURL.indexOf(links) != -1){ 7 myNav[i].parentNode.className="selected"; 8 } 9 }
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 单元测试从入门到精通