.net中在读取控件的class或ID不同方式的不同意义- jquery选择器

标签：

1. $("parent > child") - 在（父亲）parent的儿子中找符合条件的儿子（child）等同于$("parent").children("child");

1 <div>
2   <span>123</span>
3   <p>
4     <span>456</span>
5   </p>
6   <span>789</span>
7 <div>

$(‘div > span‘).css(‘color‘, ‘#FF0000‘);

结果显示如下：
 123　　　 

       456

       789

　　 这样理解：要求是寻找div（父亲）下边的span（儿子），虽然p(儿子)元素下也有span（p的儿子div的孙子），但是不符合条件。

       2. $("A B") - 在（父亲）A下找所有符合条件的（子孙）B 等同于$("A").find("B") 或  $("A" "B")。 注：中间有空格。

1 <div>
2   <span>123</span>
3   <p>
4     <span>456</span>
5   </p>
6   <span>789</span> 
　　<span>
　　　　<p>abc</p>
　　</span> 
7 <div>

$(‘div span‘).css(‘color‘, ‘#FF0000‘);  
$(‘div span p‘).css(‘color‘, ‘#FF0000‘); 

结果显示如下：

1.  

123　　　 

      456

      789

　　abc

　　这样理解：要求是寻找div下边的span（子孙），只要是div下边的span都是要查询的结果。

　　2. 

123　　　 

      456

      789

　　abc

这样理解：要求是寻找div下边的span（子孙）的下得p，只要是div下边的span下边的p都是要查询的结果。

3.$("AB") 中间没有空格，表示“且“的关系，意思为有相同的控件存在然后通过空间的ID或class再判断到底是哪个控件//或者class存在多个名称

1 <div>
2   <span class="test">123</span>
3   <p>
4     <span class="test">456</span>
5   </p>
6   <span>789</span>
7   <div class="test">abc</div>
　　<span class="test1 test2"> dce</div>
8 </div>

1.  $("span.test").css(‘color‘, ‘#FF0000‘);

2.  $("div.test").css(‘color‘, ‘#FF0000‘);

3.  $(".test1.test2").css(‘color‘, ‘#FF0000‘);

结果显示如下：

1.123 456 789 abc  cde //查找class为test的span控件,可以查找出两个

2.123 456 789 abc cde //查找class为test的div控件，只有一个

3.123 456 789 abc cde //查找class即为test1又为test1的元素，只有一个
     

4.$("A,B") 表示”或“关系一个双引号中用逗号分隔不同的选择器，称之为并列选择器。

1  <div>123</div>
2  <div>
3      <span id="test">456</span>
4      <span class="test">789</span>
5      <p class="test">abc</p>
6  </div>

1. $("span,.test").css(‘color‘, ‘#FF0000‘);  });
2. $("span,#test").css(‘color‘, ‘#FF0000‘);  });
3. $(".test,#test").css(‘color‘, ‘#FF0000‘);  });

结果显示如下：

1. 123 456 789 abc   //所有span或class是test的

2. 123 456 789 abc  // 所有span或ID是test的

3. 123 456 789 abc  // 所有ID或class是test的

.net中在读取控件的class或ID不同方式的不同意义- jquery选择器

标签：

原文地址：http://www.cnblogs.com/brooks5006/p/4463456.html