扩大
缩小

jquery选择器

常见的css选择器:
1.id选择器 #div1{}
2.标签选择器 input{}
3.类选择器 .highlight{}
4.群组选择器 #div1,#div2{}
5.后代选择器 #div1 tr{}
6.统配选择器 *{}
jquery 选择器和css的选择器的区别
1.jquery选择器完全继承了css的风格。
2.jquery选择器不需要考虑浏览器的兼容性。
3.jquery选择器选择后,添加的是方法行为,而 css选择器添加的是样式。

判断是否获取到了元素
if($("#tt").length >0) or if($("#tt")[0])

jquery选择器
1基本选择器:
#id id选择器
.class 类选择器
input 标签选择器
* 匹配选择器
s1,s2 集合选择器
2层次选择器
$("div span") 选取所有后代元素
$("div > span") 获取所有直接子元素
$(".one + div") 获取下一个是div的同辈元素 一般使用next()
$("#tow ~ div") 获取元素后面所有的div同辈元素 一般使用nextAll() 这个只是获取指定元素后面的兄弟元素,siblings获取所有同辈的元素。
3过滤选择器
3.1基本过滤选择器
:first 获取第一个元素
:last 获取最后一个元素
:not 去除给定选择器匹配的元素
:even 索引是偶数的元素。索引从0开始
:odd 索引是奇数的元素
:eq() 索引=
:lt() 索引<
:gt() 索引>
:header 选取所有的标题元素 如<h1></h1>
:animated 选取当前正在执行动画的所有元素
:focus 选取当前获取焦点的元素
3.2内容过滤选择器
:contains(text) $("div:contains('我')") 选取含有文本我的div元素
:empty $("div:empty") 选取不包含子元素的div元素
:has() $("div:has(p)") 选取含所有p元素的div元素
:parent() $("div:parent") 选取拥有子元素的div元素、
3.3可见性过滤选择器
:hidden
:visible
3.4属性过滤选择器
[attr] $("div[id]") 选取有属性id的div元素
[attr=vlaue] $("div[myid=test]") 选取myid为test的div元素
[attr!=value] $("div[id!=test]") 选取id不等于test的div 元素,没有id的元素也是会被选中的
[attr^=value] $("div[id^=test") 选取id以test开始的div元素
[attr$=value] $("div[id$=test") 选取id以test结尾的div元素
[attr*=value] $("div[id*=test") 选取id含有test的div元素
[attr|=value] $("div[id|=test") 选取id是test的元素或者是以test为前缀的div元素(注:前缀是这样的test_这种样式的)
[attr~=value] $("div[id~=test") 选取id是test的元素或者是以test为后缀缀的div元素(注:前缀是这样的test_这种样式的)
[attr1][attr2] $("div[id][title$='test']") 选取拥有属性id ,并且属性title 以test结束的div元素
3.5子元素过滤选择器(这里注意索引都是从1开始的)
:nth-child() ()中可以是even ,odd,2,3n ,3n+1
:first-child 获取每个父元素的第一个子元素
:last-chilld 获取每个父元素的最后一个子元素
:only-child 获取每个父元素的为一个子元素,如果父元素含有其他的子元素则不会匹配上。
3.6表单对象属性过滤器
:enabled 选取所有可用元素
:disabled 选取所有不可用元素
:checked 选取所有被选中的元素
:selected 选取所有被选中的选项元素
4.表单选择器
:input 选取的是input,testarea,select,button的元素 使用样例 $("#form1 :input") 和$("form1 input")区别 一个是表单选择器,一个是标签选择器
:text
:password
:checkbox
:submit
:reset
:image
:button
:file
:hidden

posted on 2016-02-14 23:01  LinuxPanda  阅读(394)  评论(0编辑  收藏  举报

导航