我自己来回答吧，不用你们写的那么复杂,每个页面加入一段CSS

//首页
ul li a:nth-child(1){
            color: #FF0000;
        }
//品牌介绍
ul li a:nth-child(2){
            color: #FF0000;
        }
//招牌美食
ul li a:nth-child(3){
    .........
}

保存个屁噢，我从导航栏进了a页面，关掉，再从地址栏进入b页面，这时候你还给我高亮a页面么？
写个所有页面公用的解析函数，直接用nav的地址去和href匹配

说一下思路，在每个页面加上js判断

假设跳转之后页面的地址是http://********/zhaoshang.html

if(/zhaoshang/.test(window.location.pathname)){

招商加盟.style.color="红色"

}else if(){
...
}

几个办法：

1. 导航栏自己一个iframe；

2. 用sessionStorage / localStorage 保存状态；

3. 跳转页面带URL参数&active =xxx；

4. 用spa 不真的跳转页面；
   看答主的题目，估计2、3比较合适

没必要用到JS 直接用css 类名就好了 每一个nav 加上一个类名，放到这个nav的css文件中

<nav>
    <a class="index-active">首页</a>
    <a class="details-active">详情页</a>
 </nav>
 
 在 index.css 中 写 
     .idnex-active {...}
 在 detail.css 中 写 
     .detail-active {...} 

保存在本地啊

后台可以做判断，当前页面是哪个然后加类，这个比较方便。

保存本地，再次进入页面时，读取缓存，进行判断

把状态保存到cookie吧。

保存到session也行，不过这需要后端开发配合。

给li的class加一个active,设置active的字体颜色，动态给各个li添加class!