完善的jquery處理機(jī)制
使用jQuery選擇器不僅比使用傳統(tǒng)的getElementById()和getElementsByTagName()函數(shù)簡(jiǎn)潔得多,而且還能避免某些錯(cuò)誤。請(qǐng)看下面例子:
<script> document.getElementById("div").style.color ="red"; </script>
運(yùn)行上面代碼后,瀏覽器就會(huì)報(bào)錯(cuò),原因是網(wǎng)頁(yè)中沒有ID為div的元素。
改進(jìn)后代碼如下:
<script> if(document.getElementById("div")){ //用了IF語(yǔ)句來判斷是否有ID為div的元素,如果有,執(zhí)行下面代碼 document.getElementById("div").style.color ="red" } </script>
這樣就可以避免游覽器報(bào)錯(cuò),但如果要操作的元素很多,可能對(duì)每個(gè)元素都要進(jìn)行一次判斷,而jquery方面問題上的處理是非常不錯(cuò)的,即使用JQUERY獲取網(wǎng)頁(yè)中不存在的元素也不會(huì)報(bào)錯(cuò)。
代碼如下:
<script> $("#div").css("color","red"); </script>
有了這個(gè)預(yù)防措施,即使以后因?yàn)槟撤N原因刪除網(wǎng)頁(yè)上某個(gè)以前使用過的元素,也不用擔(dān)心這個(gè)網(wǎng)頁(yè)的JavaScript會(huì)報(bào)錯(cuò)。
注意點(diǎn):
$("div")獲取的永遠(yuǎn)是jquery對(duì)象,即使網(wǎng)頁(yè)上沒有此元素。因此當(dāng)要用jquery檢查某個(gè)元素在網(wǎng)頁(yè)上是否存在時(shí)。
不能使用以下代碼:
<script> if($("#div")){ $("#div").css("color",red) //這樣游覽器會(huì)報(bào)錯(cuò) } </script>
而是應(yīng)該跟獲取長(zhǎng)度來判斷。
代碼如下:
<script> if($("#div").length >0){ $("#div").css("color",red) } </script>
這時(shí)候也可以轉(zhuǎn)化為DOM對(duì)象來判斷。
代碼如下:
<body> <div id="div">ccccccc</div> <script src="jquery-2.1.4.min.js"></script> <script> var $div = $("#div"); var div = $div[0]; if(div){ $div.css("color","red") //此時(shí)DIV的顏色就變?yōu)閞ed } </script> </body>
這就是jquery完善的處理機(jī)制的,希望對(duì)大家學(xué)習(xí)jquery程序設(shè)計(jì)有所幫助。
相關(guān)文章
jquery $.each 和for怎么跳出循環(huán)終止本次循環(huán)
如何在jquery 中的循環(huán)中終止本次循環(huán)或者跳出循環(huán)呢?經(jīng)搜索發(fā)現(xiàn)個(gè)不錯(cuò)的方法,大家不妨參考下,希望對(duì)大家有所幫助2013-09-09Jquery實(shí)現(xiàn)瀑布流布局(備有詳細(xì)注釋)
這篇文章主要介紹了Jquery實(shí)現(xiàn)瀑布流布局的方法,可實(shí)現(xiàn)圖片的動(dòng)態(tài)加載功能,且代碼備有詳細(xì)注釋便于理解,需要的朋友可以參考下2015-07-07基于jquery實(shí)現(xiàn)的類似百度搜索的輸入框自動(dòng)完成功能
自動(dòng)完成功能是指:類似百度搜索之類的輸入一個(gè)詞的一部分后就自動(dòng)提示,然后用戶可以選擇,不需要再輸入剩余部分。2011-08-08jquery實(shí)現(xiàn)的代替?zhèn)鹘y(tǒng)checkbox樣式插件
這篇文章主要介紹了jquery實(shí)現(xiàn)的代替?zhèn)鹘y(tǒng)checkbox樣式插件,可實(shí)現(xiàn)滑動(dòng)選擇的效果,需要的朋友可以參考下2015-06-06基于jquery1.4.2的仿flash超炫焦點(diǎn)圖播放效果
有了jquery一切變的如此簡(jiǎn)單!讓js做的動(dòng)畫更有動(dòng)感。2010-04-04