在做静态页面的时候我们通常会把a标签设置为#或者是javascript:; 在工作中做的时候由于之前没有太大注意,导致我想要跳转到别的页面继续保留更改后的样式,直接利用js增删类名,在跳转到另一个页面后,发现样式被重置了,每次我们都会重新刷新页面,这里我解决的方法是
html:
<nav>
<ul>
<li><a href="index.html">首页</a></li>
<li><a href="pinlun.html">新闻</a></li>
<li><a href="VIP.html">评论</a></li>
<li><a href="xinwen.html">推荐</a></li>
<li><a href="yidong.html">VIP影院</a></li>
</ul>
</nav>
js:循环遍历a标签的href与当前页面的href比对,进行样式添加(注:如果链接地址都一样的话可以任意添加个随即后缀,)
$(function() {
$('nav li a').each(function(){
if($($(this))[0].href==String(window.location.href))
$(this).css({"color":"red"});
})
})