导航栏当前项加class定义高亮方法，它能让用户知道自己当前所在的栏目，虽是细节但也能对用户体验形成一定的影响！

需要说明的是：单纯的靠js去实现这个需求，未尝不可但却是有缺陷的，更致命的是这些缺陷就js而言还是不可修复的，致命硬伤啊！
附js实现源码：

<ul id="nav">
<li><a href="testing1.html">链接1</a></li>
<li><a href="testing2.html">链接2</a></li>
<li><a href="test3.html">链接3</a></li>
<li><a href="test4.html">链接4</a></li>
</ul>
<script type="text/javascript">
//缺陷：基于地址栏与导航栏href属性匹配来判定class的添加，不适用于2级菜单，直接进入内页(如：新闻页)无法标识！
currentActive("nav","current-active");
function currentActive(navId,curClass){//: navId：导航父元素ID;curClass: 导航栏当前激活需添加的class名
var navId=document.getElementById(navId);
var links=navId.getElementsByTagName("a");
var currentLink=window.location.href;
for(var i=0;i<links.length;i++){
var menuLink=links[i].href;
if(currentLink.indexOf(menuLink)!=-1){
links[i].className=curClass;
}else{
links[i].className="";
}
}
}
</script>

网上有资料介绍说用什么Cookie方法来实现，这方法其实不可取！最完善的方法是：借助后台程序去实现这功能！
原理：
根据页面内容所属分类与导航栏相匹配的方法(url传参)，来实现当前项的class添加！基本源码一般是这样的：

<!-- 类似链接：https://www.debug.org/?c=cat1&othter=arguments 地址栏参数c代表网站分类 -->
<ul id="nav">
<li><a href="testing1.html" <?php echo $_REQUEST['c']=='cat1'?'class="current-active"':'';?>>链接1</a></li>
<li><a href="testing2.html" <?php echo $_REQUEST['c']=='cat2'?'class="current-active"':'';?>>链接2</a></li>
<li><a href="test3.html" <?php echo $_REQUEST['c']=='cat3'?'class="current-active"':'';?>>链接3</a></li>
<li><a href="test4.html" <?php echo $_REQUEST['c']=='cat4'?'class="current-active"':'';?>>链接4</a></li>
</ul>

本人只是一名小前端，涉及到后台编程部分，这里就不做详解了，相信作为一枚程序猿看到这里应该能完全理解！