jquery 注意事項與常用語法小結
2024-05-06 12:37:05
供稿:網友
1、關于選擇器中含有特殊符號
選擇器中含有".","#","(","]"等特殊字符,根據W3C的規定,屬性值中是不能含有這些特殊字符的,例如:
代碼如下:
<div id="id#b">bb</div>
<div id="id[1]"></div>
如果按照普通的方式來獲取,例如:
代碼如下:
$("#id#b");
$("#id[1]");
以上代碼不能正確獲取到元素,正確的寫法如下:
代碼如下:
$("#id//#b");
$("#id//[1//]");
2、關于選擇器中含有空格的
看下面這個例子,它的HTML代碼如下:
代碼如下:
<div class="test">
<div style="display:none;">aa</div>
<div style="display:none;">bb</div>
<div style="display:none;">cc</div>
<div class="test" style="display:none;">dd</div>
</div>
<div class="test" style="display:none;">ee</div>
<div class="test" style="display:none;">ff</div>
使用jquery選擇器分別獲取它們:
代碼如下:
alert($(".test :hidden").length);//輸出4
alert($(".test:hidden").length);//輸出3
之所以會出現不同的結果,是因為后代選擇器與過濾選擇器的不同。
代碼如下:
$(".test :hidden").length;//帶空格的
以上代碼是選取class為"test"的元素里面的隱藏元素。
代碼如下:
$(".test:hidden").length;//不帶空格的
而上面的代碼則是選取隱藏的class為"test"的元素。
3、關于val()方法
在jquery中,val()方法是從最后一個選項往前讀取,如果選項的value或者text中任意一項符合就會被選中,例如:
代碼如下:
<option value="1號">2號</option>
<option value="2號">1號</option>
無論使用val("1號")還是val("2號"),都會選中后面的那個option
4、關于css()方法
如果參數值是數字,將會被自動轉換為像素值;如果屬性中帶有"-"符號,例如font-size、background-color等屬性,如果在設置這些屬性的值的時候不帶引號,那么就要用駝峰式寫法,例如:
代碼如下:
$("p").css({fontSize:"30px", backgroundColor:"#888888"});
如果帶上了引號,既可以寫成"font-size",也可以寫成"fontSize",建議大家加上引號,養成良好的習慣。
5、關于height()方法
(1)、在jQuery1.2版本以后的height()方法可以用來獲取window和document的高度。
(2)、用css()方法獲取高度值與height()方法的區別是: css()方法獲取的高度值與樣式的設置有關,可能會得到"auto",也可能得到"10px"之類的字符串;而height()方法獲取的高度值則是元素在頁面中的實際高度,與樣式的設置無關,并且不帶單位。
6、關于事件對象(event)的屬性
jQuery對事件對象的常用屬性進行了封裝,使得事件處理在各大瀏覽器下都可以正常運行而不需要進行瀏覽器類型判斷。