《jquery常用选择器.docx》由会员分享，可在线阅读，更多相关《jquery常用选择器.docx（4页珍藏版）》请在三一办公上搜索。
1、jquery常用选择器层次选择器： $(div p);/选取div下的所有的p元素 $(divp).css(border,1px solid red);/只选取div下的直接子元素 /相邻的元素 $(div p).css(border,1px solid red);与$(div).nextAll(p)等价;/表示div后面的 所有p兄弟元素 $(div *).css(border,1px solid red);/表示div后面的所有兄弟元素 $(div +p).css(border,1px solid red);与$(div).next(p)等价/这种写法表示div后 只找紧挨着的第一个兄弟元
2、素，并且该元素是p。 获得兄弟元素的方法： next; /当前元素之后的紧邻着的第一个兄弟元素 nextAll;/当前元素之后的所有兄弟元素 prev;/当前元素之前的紧邻着的兄弟元素 prevAll;/当前元素之前的所有兄弟元素 siblings;/当前元素的所有兄弟元素 基本过滤选择器： $(p:first)与$(p).first是等价的。获取所有p元素中的第一个P元素 $(p:last)与$(p).last $(p:eq(2)在所有的p元素中找到索引为2的元素 $(p:even)选取所有奇数的p标签 $(p:odd)选取所有偶数的p标签 $(p:not(.tst).css;选取所有的不应
3、用.tst这种样式的p元素not后面写一个选择器名称 $(p:gt(1)选取所有索引值大于1的p元素 $(p:lt(3)选取所有索引值小于3的p元素。 $(:header)选取页面上所有的h1-h6的元素。 属性过滤选择器： $(divid)选取有id属性的 $(divtitle=test)选取title属性为“test”的，jQuery中没有对getElementsByName 进行封装，用$(inputname=abc) $(divtitle!=test)选取title属性不为“test”的 还可以选择开头、结束、包含等，条件还 可以复合。 表单对象属性选择器： $(#form1 :ena
4、bled)选取id为form1的表单内所有启用的元素 $(#form1 :disabled)选取id为form1的表单内所有禁用的元素 $(“input:checked”)选取所有选中的元素,这个中间不能加空格. $(select :selected)选取所有选中的选项元素 表单滤选择器： $(#form1:enabled);/这个表示能够启用的且id为form1的标签 $(#form1 :enabled)；/这个表示能够启用的且id为form1下的所有启用的元素。 $(input:checked) $(input:disabled) $ (select:selected) $(“:input
5、)选取所有、和元素。和$(input)不一样， $(input)只获得 $(:text)选取所有单行文本框，等价于 $(inputtype=text),$(inputtype=text),$(:text); $(“:password”)选取所有密码框。 内容过滤选择器： :contains(text):过滤出包含给定文本的元素。 ：empty包含没有子元素的或者是内容为空的元素。 ：has(selecttor) :parent 获得有子元素的元素。 可见性过滤器： :hidden 选取所有不可见元素包括:(如果直接写:hidden则会包含headtitlescriptstyle.) 1.表单元
6、素type=“hidden” 2.设置css的display:none 3.高度和宽度明确设置为0的元素。 4.父元素时隐藏的，所以子元素也是隐藏的 visibility: hidden 与opacity为0不算，因为还占位所以不认为是hidden.(与之前版本 jQuery不太一样，1.3.2之前) :visible 选取所有可见元素 子元素过滤选择器： first-child 与first的区别：first只能选取第一个，而first-child,则能选取每个子元素的第一个元素。 last-child： only-child:匹配当前父元素中只有一个子元素的元素。 nth-child:对比
7、eq来理解，eq值匹配一个，nth-child为每个父元素都要匹配一个子元素。 nth-child(index),index从1开始 nth-child(even) nth-child(odd) nth-child(3n),选取3的倍数的元素 nth-child(3n+1)满足3的倍数+1的元素 注意： 1.通过jQuery选择器选择的对象本身就是一个jQuery对象，选择器具有隐式迭代 的作用，例如： $(p).click(function alert(this.innerText); ); 是为所有的p都注释了click事件。 2.无论选择器选择了几个元素返回的一个元素都是一个集合对象，如果没有找到相应的元素，则这个集合对象的length值为0，如果选择到了元素，这个length的元素就是选择的元素的索引值。所以也根据这个属性来判断元素是否存在。例如： Iif($(#div).length0)/判断元素是否存在 3.在事件中this还是表示当前触发事件的元素的对象，但是这里的this是dom对象而不是jQuery对象。如果需要执行jQuery中的方法或属性时，应该把this转换为jQuery对象 转换方式为：$(this);
