JQuery选择器

选择器总结：

核心选择器（应用最广泛的选择器）
* 选择所有元素
元素 选择特定类型的元素
.类名 选择具有特定class的元素
元素.类名 选择具有特定class的某类元素
#id 选择具有特定id属性值的元素
属性选择器（根据元素的属性来选择元素）
[attr] 选取定义了attr属性的元素，即使这个属性没有值
[attr="val"] 选取attr属性值等于字符串val的元素
[attr^="val"] 选取attr值以val开头的元素
[attr$="val"] 选取attr值以val结尾的元素
[attr*="val"] 选取attr值包含val的元素
[attr~="val"] 选取attr属性其中一个值是字符串val的元素
[attr|="val"] 选取attr属性等于字符串val，或属性值为连字符分割的值列表且第一个值为val的元素，如attr="val-aaa-bbb"
[selector1][selector2][selector3]... 复合属性选择器，需要同时满足多个条件使用，属性选择器可以配合其他选择器使用
关系选择器
<selector1> <selector2>  在给定的祖先元素下匹配所有的后代元素
<selector1>><selector2>  在给定的父元素下匹配所有的子元素
<selector1>+<selector2>  匹配所有紧接在<selector1>元素右面的<selector2>
<selector1>~<selector2>  匹配<selector1>元素的所有同辈<selector2>元素
伪元素和伪类选择器
:checked 用于表单，匹配所有被选中元素（单选、复选框等，不包括select元素的option元素）
:disabled 用于表单，匹配所有不可用元素
:enabled 用于表单，匹配所有可用元素
:focus 主要用于表单，选取得到焦点的元素
:required 用于表单，选取具有required属性的元素
:optional 用于表单，选取缺少required属性的元素
:empty 匹配所有既不包含子元素也不包含文本的空元素
:first-child 选取第一个子元素
:last-child 选取最后一个子元素
:nth-child(n) 选取元素的第n个子元素（从1开始），n可为even或odd
:nth-last-child(n) 选取元素的倒数第n个子元素
:nth-of-type(n) 选取同属于一个父元素之下，并且标签名相同的元素中的第n个
:nth-last-of-type(n) 选取同属于一个父元素之下，并且标签名相同的元素中的倒数第n个
:only-child 如果某个元素是父元素中唯一的子元素，将会被匹配
:only-of-type 选择所有没有兄弟元素的元素
:root 选取文档的根元素，在html文档中即是<html>元素
联合选择器和反选择器
<selector1>,<selector2>,<selector3>…… 匹配各个选择器的交集元素
:not(selector) 匹配不符合选择器要求的元素
jQuery扩充的选择器
:animated 匹配所有正在执行动画效果的元素
:contains(text) 如果元素内或者后代元素内包含指定的文本即被选中
:eq(n) 选择第n个元素（从0开始计数）
:first 选择第一个匹配的元素
:last 选择最后一个匹配的元素
:lt(n) 选择序号小于n的所有元素（从0开始计数）
:gt(n) 选择序号大于n的所有元素（从0开始计数）
:odd 选择所有奇数元素(从0开始计数)
:even 选择所有的偶数元素（从0开始计数）
:has(选择器) 匹配包含 选择器所匹配的元素的元素
:text 用于表单，匹配所有的单行文本框
:button 匹配所有按钮（input标签type为button以及<button>标签）
:checkbox 用于表单，选择所有的复选框（匹配所有复选框）
:file 用于表单，选择所有的文件上传输入框
:input 用于表单，选择所有的input元素（匹配所有 input, textarea, select 和 button 元素）
:password 用于表单，选择所有的密码输入框
:radio 用于表单，选择所有的单选框
:submit 用于表单，选择所有的表单提交按钮
:image 用于表单，匹配所有图像域
:reset 用于表单，选择所有的表单重置按钮
:selected 用于表单，匹配所有选中的option元素
:header 匹配如 h1, h2, h3之类的标题元素
:hidden 选择所有的被隐藏文件
:visible 选择所有的可见元素
:parent 匹配含有子元素或者文本的元素
限制搜索的范围
表达式 例子 说明 备注
$(选择器,$(选择器))

var $divs=$('#div1');alert($('p',$divs).length);

 id为div1的元素及其后代元素范围中p元素的个数  
posted @ 2016-10-03 11:55  舒山  阅读(263)  评论(0)    收藏  举报