溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

JQuery鏈?zhǔn)讲僮黠L(fēng)格:簡(jiǎn)單導(dǎo)航欄

發(fā)布時(shí)間:2020-06-25 18:39:09 來源:網(wǎng)絡(luò) 閱讀:733 作者:1120173856 欄目:web開發(fā)

 鏈?zhǔn)讲僮黠L(fēng)格:簡(jiǎn)單導(dǎo)航欄

<script src="js/jquery-1.7.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){    //等待dom元素加載完畢
$(".has_children").click(function(){      //當(dāng)鼠標(biāo)點(diǎn)擊含有.has_children元素的時(shí)候
$(this).addClass("highlight")   //選擇本元素添加一個(gè)類.highlight
.children("a")  //其內(nèi)部全部<a>子元素
.show()  //顯示元素
.end()  //重新定位到上次操作的元素
.siblings()  //含有.has_children的class的同輩元素
.removeClass("highlight"); //移除類.highlight
.children("a") //其內(nèi)部全部<a>子元素
.hide(); //隱藏元素
});
});
</script>
 
 
<!--------------- 代碼格式調(diào)整后,易讀性好了很多 ------------------>
通過類似有意義的注釋,能夠培養(yǎng)良好的編碼習(xí)慣和風(fēng)格,提高開發(fā)效率;
上傳了實(shí)例附件!需要的話就下載使用“記得自己換回后綴名.html”.使用時(shí)記得加載JQuery庫喔!
<script type="text/javascript">
$(document).ready(function(){    
$(".has_children").click(function(){  
$(this).addClass("highlight")
.children("a").show().end()
.siblings().removeClass("highlight")
.children("a").hide();  
});
});
</script>
 
附圖:
 

JQuery鏈?zhǔn)讲僮黠L(fēng)格:簡(jiǎn)單導(dǎo)航欄

 
 
——參考資料《鋒利的JQuery》

 

附件:http://down.51cto.com/data/2361035
向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI