使用JS技术,让导航条高亮显示当前页面_网络编程_奇迪科技(深圳)有限公司(www.qvdv.net)

欢迎来到奇迪科技(深圳)有限公司,超值服务提供卓越产品!

网络编程

使用JS技术,让导航条高亮显示当前页面

作者:admin 来源: 更新时间:2024-02-16

导航html代码:
<ul id="navi">
<li>
<a href="https://www.qvdv.net/qvd-zs.html">网站建设</a>
</li>
<li>
<a href="https://www.qvdv.net/">虚拟主机</a>
</li>
<li>
<a href="https://www.qvdv.net/domain/">域名申请</a>
</li>
</ul>
CSS代码:
.nav_local {
height: 43px;
background-repeat: no-repeat;
background-position: 0px -55px;
}
JS代码:
<script type="text/javascript">
<!--
//导航高亮
var nav = document.getElementById("navi");
var links = nav.getElementsByTagName("li");
var lilen = nav.getElementsByTagName("a");
currenturl = document.location.href;
var last = 0;
for(var i=0;i<links.length;i++){var linkurl =  lilen[i].getAttribute("href");
if(currenturl.indexOf(linkurl)!=-1){last = i;
}}
links[last].className = "nav_local";
//-->
</script>

本文版权所有,转载须注明:来源  https://www.qvdv.net/qvdv-oop-329.html