前端：导航栏标签active

首先是HTML

<!--Head page -->
<nav class="navbar navbar-default navbar-static-top" role="navigation">
   <ul class="nav nav-pills" style="margin-top:6px;margin-left:10%">
      <li class="active"><a href="#">首页</a></li>
      <li><a href="#">SVN</a></li>
      <li><a href="#">iOS</a></li>
      <li><a href="#">VB.Net</a></li>
      <li class="dropdown">
         <a class="dropdown-toggle" data-toggle="dropdown" href="#">
            Java <span class="caret"></span>
         </a>
         <ul class="dropdown-menu">
            <li><a href="#">Swing</a></li>
            <li><a href="#">jMeter</a></li>
            <li><a href="#">EJB</a></li>
            <li class="divider"></li>
            <li><a href="#">分离的链接</a></li>
         </ul>
      </li>
      <li><a href="#">PHP</a></li>
   </ul>
</nav>
<!--/Head page -->

其次是JavaScript

<script type="text/javascript">    
       $("document").ready(function(){ 
        $("nav ul li").click(function(){
          $("nav ul li").removeClass("active");//首先移除全部的active
          $(this).addClass("active");//选中的添加acrive
       });
      });
 </script>

最后效果图

　　

需要注意的是要将javascript放在body体之内