jquery/js当前URL对当前栏目高亮突出显示
2016-01-04 16:10
686 查看
html:
jquery:
或者原生js:
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 }
相关文章推荐
- 基于jquery封装的一个简单web右键菜单
- jquery操作select(取值,设置选中)
- jquery中prop()方法和attr()方法的区别
- jQuery——自定义事件
- jquery中cookie用法实例详解(获取,存储,删除等)
- js和jquery获取父级元素、子级元素、兄弟元素的方法
- jQuery AJAX实现调用页面后台方法
- 浅析JQuery中的html(),text(),val()区别
- jQuery轻量级响应式图片轮播插件ResponsiveSlides.js(仅1kb)
- jQuery提示插件alertify使用指南!
- jQuery插件之jQuery.Form.js用法实例分析(附demo示例源码)
- jQuery中data方法内部运行原理
- jquery-懒加载技术(简称lazyload)
- jquery中attr和prop的区别
- jQuery提示插件alertify使用指南
- [转]jQuery实现清空table表格除首行外的所有数据
- 25个可遇不可求的jQuery插件
- 怎么写jQuery的插件
- 用jquery.pager.js实现分页
- jquery easyui datagrid使用参考