zoukankan      html  css  js  c++  java
  • 高亮效果,比如导航高亮

    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>

  • 相关阅读:
    scss使用指南--每天一点
    Egret引擎开发基础(一)
    vue-awesome-swiper使用自动轮播和循环轮播不生效(loop和autoplay)
    Vue项目中title的设置,使用document.title返回时不生效
    charles系列破解激活注册码
    Vscode中vue项目中无法对js进行提示
    JS数组与对象的遍历方法大全
    手把手教你用webpack3搭建react项目(开发环境和生产环境)(二)
    服务器安装redis-stat和easyNmon
    Shell备份数据库
  • 原文地址:https://www.cnblogs.com/chengmingxiaowu/p/7598008.html
Copyright © 2011-2022 走看看