htm公共头部分的css怎么去改变

Question

我的项目中 一个网页分成了3部分

header.html
index.html
footer.html

这种方式大家都不陌生。如果新加一个页面只要加入一个login.html然后加载头尾即可。
但是有一个问题大家是怎么解决的

就是我的公共header.html里面的导航有激活(active)这种状态。
主页就激活主页的按钮，注册激活注册的按钮。
期初我是用jq添加的。请问各路码仙是怎么弄的。

补充下

比如
在header.html里面有这样的代码

<ul>

<li class="active">主页</li>
<li>文章</li>
<li>关于</li>

</ul>

如果login和index都用这个公共的header。那么active只会在主页的按钮上。
我现在是用jq addClass（）可以解决这个问题，但是还有其他什么方法不。

Answer 1

可以用后端的代码来实现啊，

Answer 2

用js获取当前页面地址，再给对应的加class

Answer 3

<!-- 跳转改变导航样式js必须写在header.html里面，如在index.html等其他页面写或引入，则无效 -->
<script type="text/javascript">
    $(document).ready(function() {
        $(".pcNav li a").each(function() {
            if($(this)[0].href == String(window.location)) {
                $(this).parent("li").addClass("active");
            }
        });
    })
</script>