<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>
通過類似有意義的注釋,能夠培養(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》