jQ选择器

jQ选择器分为基本选择器，层次选择器，过滤选择器，内容过滤选择器，可见性过滤选择器，属性过滤选择器，子选择过滤器，表单对象属性过滤选择器

注意：选择器中空格不容忽视，多一个空格和少一个空格也许会得到截然不同的结果。

例如：

var $t_a = $('.test :hidden');//表示class为test标记的子孙标记隐藏的数量 （.test和:hidden之间有一个空格   .test :hidden）

var $t_b = $('.test:hidden');//表示class为test标记的隐藏数量（.test和:hidden之间没有空格   .test:hidden）

1、层次选择器

（1）$("ancestor  descendant"),后代选择器   //选取ancestor（先祖）元素里的所有descendant(后代)元素。

返回：集合元素

例如：$(" div  span") //选取<div>里的所有的<span>元素

（2）$("parent>child"),子选择器  //选取parent（父元素）下的child（子元素）

例如：$(" div> span") //选取<div>里的子元素<span>

 

 

5、可见性选择器

注意：在可见性选择器中，需要注意选择器:hidden，它不仅包括样式属性display为none的元素，也包括文本隐藏域<input type="hidden" />和visibility:hidden之类的元素。

 

6、属性过滤选择器

1.[attribute];选取拥有此属性的元素;$("div[id]")选取拥有属性id的元素  

2.[attribute=value];选取属性的值为value的元素;$("div[title=test]")选取属性title为"test"的div元素  

3.[attribute!=value];选取属性的值不为value的元素;$("div[title!=test]")选取属性title不为"test"的div元素  

4.[attribute^=value];选取属性的值以value开始的元素;$("div[title^=test]")选取属性title已"test"开始的div元素  

5.[attribute$=value];选取属性的值以value结束的元素;$("div[title$=test]")选取属性title已"test"结束的div元素  

6.[attribute*=value];选取属性的值含有value的元素;$("div[title*=test]")选取属性title含有"test"的div元素  

7.[attribute|=value];选取属性的值等于给定字符串或以该字符串为前缀(该字符串后跟一个连字符"-")的元素;$("div[title|='en']")选取属性title等于"en"或以en为前缀(该字符串后跟一个连字符"-")的div元素  

8.[attribute~=value];选取属性用空格分隔的值中包含一个给定值的元素;$("div[title-='uk']")选取属性title用空格分隔的值中包含字符uk的元素  

9.[attribute1][attribute2][attribute3];用属性选择器合并成一个复合属性选择器,满足多个条件,每选择一次,缩小一次范围;$("div[id][title$='test']")选取拥有属性id并且属性title以"test"结束的div元素

 

转载于:https://www.cnblogs.com/xmlys/p/7644577.html