jQuery選擇器特殊字符與屬性空格問題
一、選擇器中含有特殊符號的注意事項
1.選擇器中含有“.”、“#”、“(”或“]”等特殊字符
根據W3C的規(guī)定,屬性值中是不能含有這些特殊字符的,但在實際項目中偶爾會遇到表達式中含有“#”和“.”等特殊字符,如果按照普通的方式去處理出來的話就會出錯。解決此類錯誤的方法是使用轉義符轉義。
<div id="id#b">bb</div> < div id="id[1]">cc</div>
不能這樣寫:
$('#id#b');
$('#id[1]');
應該使用轉義符號:
$('#id\\#b'); //轉義特殊字符“#”
$('#id\\[1\\]'); //轉義特殊字符“[ ]”
2.屬性選擇器的引號問題
1.3.1版本徹底放棄了1.1.0版本遺留下的@符號,如果你使用1.3.1以上的版本,那么你不能在屬性前添加@符號,比如:
$('div[@title="test"'];
正確的寫法是:
$('div[title="test"'];
二、選擇器中含有空格的注意事項
選擇器中的空格也是不容忽視的,多一個空格或少一個空格也許會得到截然不同的結果??聪旅孢@個例子,它的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選擇器分別獲取它們。
//注意區(qū)分類似這樣的選擇器
//雖然一個空格,卻截然不同的效果.
var $t_a = $('.test :hidden');
var $t_b = $('.test:hidden');
var len_a = $t_a.length;
var len_b = $t_b.length;
alert("$('.test :hidden') = "+len_a); //輸出 4
alert("$('.test:hidden') = "+len_b); //輸出 3
之所以會出現不同的結果,是因為后代選擇器與過濾選擇器的不同。
var $t_a = $('.test :hidden'); //有空格 是選取class為“test”的元素里面的隱藏元素。
var $t_b = $('.test:hidden'); //沒有空格 則是選取隱藏的class為“test”的元素。
這點和css是一樣的 css中假如有個div有兩個class屬性.top 和 .right <div class="top right "></div>,在css中我們要選擇它定義樣式只能這樣寫 .top.right{ } 而不能寫成.top .right{ }
以上是小編為大家總結的全部內容啦,希望對大家的學習有所幫助~~
相關文章
JQuery使用index方法獲取Jquery對象數組下標的方法
這篇文章主要介紹了JQuery使用index方法獲取Jquery對象數組下標的方法,涉及jQuery中index方法的使用技巧,需要的朋友可以參考下2015-05-05
jquery radio的取值_radio的選中_radio的重置方法
下面小編就為大家?guī)硪黄猨query radio的取值_radio的選中_radio的重置方法。小編覺得挺不錯的,現在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-09-09

