根据location地址,在导航栏高亮显示当前页面
生活随笔
收集整理的這篇文章主要介紹了
根据location地址,在导航栏高亮显示当前页面
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
獲取當(dāng)前頁(yè)面的地址欄。與導(dǎo)航欄中所有<a>?標(biāo)簽的href屬性?進(jìn)行比較。如果相等則高亮顯示?此<a>標(biāo)簽。
注意點(diǎn):a?標(biāo)簽的href?屬性在瀏覽器解析時(shí)?是絕對(duì)路徑。
a?標(biāo)簽的href?如果是錨點(diǎn),則?pathname , href都與?location的?pathname ,href相等,但hash?屬性會(huì)存儲(chǔ)?錨點(diǎn),所以還需判斷是否是錨點(diǎn)。
代碼:
1 <script src="../static/assets/vendors/jquery/jquery.js"></script> 2 <script> 3 $(function(){ 4 $(".aside a").each(function(index,value){ //each()是jQ對(duì)象中的方法,只能用來遍歷jQ對(duì)象 與foreach 中的形參相反。第一個(gè)形參是索引,第二個(gè)是dom對(duì)象 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){ //如果是首頁(yè)(index) 10 $(value).parent().addClass("active"); //高亮顯示 11 } 12 }) 13 }); 14 15 </script>?
轉(zhuǎn)載于:https://www.cnblogs.com/csdcs/p/10170675.html
創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎(jiǎng)勵(lì)來咯,堅(jiān)持創(chuàng)作打卡瓜分現(xiàn)金大獎(jiǎng)總結(jié)
以上是生活随笔為你收集整理的根据location地址,在导航栏高亮显示当前页面的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: RotateDrawable
- 下一篇: Jenkins+Maven+Gitlab