bootstrap导航切换脚本

    技术2022-07-10  146

    <ul class="nav navbar-nav"> <li><a href="/">首页 <span class="sr-only">(current)</span></a></li> <li><a href="/xxx">xxx</a></li> <li><a href="/yyy">yyy</a></li> </ul> <script> // 导航切换 $(function () { $(".navbar-nav").find("li").find("a").each(function () { var a = $(this)[0]; if ($(a).attr("href") === location.pathname) { $(this).parent().addClass("active"); } else { $(this).parent().removeClass("active"); } }); }) </script> <nav class="blog-nav"> <a class="blog-nav-item active" href="/">首页</a> <a class="blog-nav-item" href="/xxx">博客</a> <a class="blog-nav-item" href="/yyy">关于</a> </nav> <script> // 导航切换 $(function () { $(".blog-nav").find("a").each(function () { var a = $(this)[0]; if ($(a).attr("href") === location.pathname) { $(this).addClass("active"); } else { $(this).removeClass("active"); } }); }) </script>
    Processed: 0.010, SQL: 9