獲取當前頁面的地址欄。與導航欄中所有<a> 標簽的href屬性 進行比較。如果相等則高亮顯示 此<a>標簽。 註意點:a 標簽的href 屬性在瀏覽器解析時 是絕對路徑。 a 標簽的href 如果是錨點,則 pathname , href都與 location的 pathname ,href相等,但 ...
獲取當前頁面的地址欄。與導航欄中所有<a> 標簽的href屬性 進行比較。如果相等則高亮顯示 此<a>標簽。
註意點:a 標簽的href 屬性在瀏覽器解析時 是絕對路徑。
a 標簽的href 如果是錨點,則 pathname , href都與 location的 pathname ,href相等,但hash 屬性會存儲 錨點,所以還需判斷是否是錨點。
代碼:
1 <script src="../static/assets/vendors/jquery/jquery.js"></script> 2 <script> 3 $(function(){ 4 $(".aside a").each(function(index,value){ //each()是jQ對象中的方法,只能用來遍歷jQ對象 與foreach 中的形參相反。第一個形參是索引,第二個是dom對象 5 if(value.pathname == location.pathname && value.hash == location.hash){ 6 $(value).parent().addClass("active"); //高亮的樣式 7 $(value).parent().parent().addClass("in"); //展開列表 8 $(value).parent().parent().prev().removeClass("collapsed"); //改變箭頭指向 9 }else if(location.pathname == "/admin/" && index == 0){ //如果是首頁(index) 10 $(value).parent().addClass("active"); //高亮顯示 11 } 12 }) 13 }); 14 15 </script>