高亮效果,比如导航高亮

html部分:

<div id="nav">

<ul>

<li><a href="">导航</a></li>

<li><a href="">导航</a></li>

<li><a href="">导航</a></li>

<li><a href="">导航</a></li>

<li class="selected"><a href="">导航</a></li>

</ul>

</div>

 

js部分:

<script type ="text/javascript" language ="javascript">

             var nav = document.getElementById( "nav");

             var links = nav.getElementsByTagName("li" );

             var lilen = nav.getElementsByTagName("a" ); //判断地址

             var currenturl = document. location.pathname.slice(0, -5);

            var last = 0;

             for ( var i = 0; i < links.length; i++) {

                 var linkurl = lilen[i].getAttribute( "href").slice(0,-5);

                if (currenturl.indexOf(linkurl) != -1 ) {

                    last = i;

                }

            }

           links[last].className = "selected"; //高亮代码样式

</script>

posted on 2017-09-26 17:44  诚明小巫  阅读(197)  评论(0编辑  收藏  举报

导航