Jquery选择器
Jquery选择器
一、常用的选择器:
- $("td",$(this)) //在this中找所有td
- $("#id") //通过ID //返回单个元素
- $("div") //通过标签
- $(".cls") //类选择器
- $("div.cls") //标签加类选择器
- $("*") //选取所有的元素
- $(this) //自己
- $("div,p,a") //取得所有标签的集合
- $("div p") //div下的所有<p>,不管几层 [子孙]
- $("div>p") //获取最直接的p [儿子]
- $("div+p") //兄弟节点中下面的第一个元素 [弟弟] //相当于.next();
- $("div~p") //层的所有下面的兄弟节点 //相当于.nextAll();
二、基本过滤选择器:
- :eq(): 索引//第1个元素 $('p:eq(0)')
- :lt(3): 索引 //索引小于3的
- :gt(3):索引 //索引大于3的 $('ul li:gt(2):lt(2)') //先执行大于2,结果集中再执行小于2
- :not():不满足"选择器"的元素
- :first:第一个
- :last:最后一个
- :even:偶数(索引的偶数,显示给用户的是奇数)
- :odd:奇数
- :header:所有h1-h6的标签 //$(':header')
- :animated:所有正在执行动画的元素
三、内容过滤选择器:
- :contains(text):选择含有文本text的元素 //有没有引号一样效果
- :empty:选择不包含元素或者文本的空元素 //<div></div>测试通过,换行应该也算字符,不能被选择 (浏览器的问题,CSS的问题)
- :has(selector):选择包含匹配元素的元素
- :parent:选择含有子元素或文本的元素
四、可见性过滤选择器:
- :hidden:选取所有不可见元素 $(":hidden") //包括display:none的元素
- :visible:选取所有可见元素 $("div:visible")
五、其他:
- :checked
- :selecetd
六、属性过滤选择器:
- [id] :选取拥有id属性的元素 //$("div[style]").hide(2000); 测试没通过 //$("div[id]").hide(2000);测试通过
- [id=text]:选取id为text的元素
- [id!=text]:选取id不为text的元素
- [id^=t]:选取id以t开头的元素
- [id$=t]:选取id以t结束的元素
- [id*=text]:选取id含有text的元素
七、子元素过滤选择器:
- :nth-child(index/even/odd/equation):选取每个父元素下的第n/奇/偶个元素 //注意:index从1开始算 //:nth-child(3n+1) 3的倍数加1
- :first-child:选取每个父元素的第一个子元素
- :last-child:选取每个父元素的最后一个子元素
- :only-child:如果这个元素是其父元素中的唯一一个元素,则匹配 //注意:操作的是子元素
八、表单对象属性过滤选择器:
- :input:选取所有input、textarea、select、button元素
- :text:选取所有单行文本框
- :password:选取所有密码框
- :radio:
- :checkbox
- :submit
- :image
- :reset
- :button
- :file
- :hidden