dw选择器
选择器并没有⼀个固定的定义,在某种程度上说,jQuery的选择器和样式表中的选择器⼗分相似。选择器具有如下特点:
1.简化代码的编写
2.隐式迭代
3.⽆须判断对象是否存在
jQuery 的选择器可谓之强⼤⽆⽐,这⾥简单地总结⼀下常⽤的元素查⽅法
$("#myELement") 选择id值等于myElement的元素,id值不能重复在⽂档中只能有⼀个id值是myElement所以得到的是唯⼀的元素$("div") 选择所有的div标签元素,返回div元素数组
$(".myClass") 选择使⽤myClass类的css的所有元素
$("*") 选择⽂档中的所有的元素,可以运⽤多种的选择⽅式进⾏联合选择:例如$("#myELement,div,.myclass")
$("form input") 选择所有的form元素中的input元素
$("#main > *") 选择id值为main的所有的⼦元素
$("label + input") 选择所有的label元素的下⼀个input元素节点,经测试选择器返回的是label标签后⾯直接跟⼀个input标签的所有input标签元素
$("#prev ~ div") 同胞选择器,该选择器返回的为id为prev的标签元素的所有的属于同⼀个⽗元素的div标签
基本过滤选择器:
$("tr:first") 选择所有tr元素的第⼀个
jquery是什么选择器$("tr:last") 选择所有tr元素的最后⼀个
$("input:not(:checked) + span") 过滤掉:checked的选择器的所有的input元素
$("tr:even") 选择所有的tr元素的第0,2,4... ...个元素(注意:因为所选择的多个元素时为数组,所以序号是从0开始)
$("tr:odd") 选择所有的tr元素的第1,3,5... ...个元素
$("td:eq(2)") 选择所有的td元素中序号为2的那个td元素
$("td:gt(4)") 选择td元素中序号⼤于4的所有td元素
$("td:ll(4)") 选择td元素中序号⼩于4的所有的td元素
$(":header") 选择所有标题元素,如h1,h2,h3等
$("div:animated") 选择所有正在执⾏动画效果的元素
内容过滤选择器:
$("div:contains('John')") 选择所有div中含有John⽂本的元素
$("td:empty") 选择所有的为空(也不包括⽂本节点)的td元素的数组
$("div:has(p)") 选择所有含有p标签的div元素
$("td:parent") 选择所有的以td为⽗节点的元素数组
可视化过滤选择器:
$("div:hidden") 选择所有的被hidden的div元素
$("div:visible") 选择所有的可视化的div元素
属性过滤选择器:
$("div[id]") 选择所有含有id属性的div元素
$("input[name='newsletter']") 选择所有的name属性等于'newsletter'的input元素
$("input[name!='newsletter']") 选择所有的name属性不等于'newsletter'的input元素
$("input[name^='news']") 选择所有的name属性以'news'开头的input元素
$("input[name$='news']") 选择所有的name属性以'news'结尾的input元素
$("input[name*='news']") 选择所有的name属性包含'news'的input元素
$("input[id][name$='man']") 可以使⽤多个属性进⾏联合选择,该选择器是得到所有的含有id属性并且name属性以man结尾的元素
⼦元素过滤选择器:
$("ul li:nth-child(2)"),$("ul li:nth-child(odd)"),$("ul li:nth-child(3n + 1)")
$("div span:first-child") 返回所有的div元素下的span元素,只取第⼀个
$("div span:last-child") 返回所有的div元素下的span元素,只取最后⼀个
$("div button:only-child") 返回所有的div下的所有的button元素中只有⼀个⼦元素的数组
表单元素选择器:
$(":input") 选择所有的表单输⼊元素,包括input, textarea, select 和 button
$('input:text') 选择所有input元素中类型为text的input元素
$('input:password') 选择所有input元素中类型为password的input元素
$('input:radio') 选择所有input元素中类型为radio的input元素
$('input:checkbox') 选择所有input元素中类型为checkbox的input元素
$('input:submit') 选择所有input元素中类型为submit的input元素
$('input:image') 选择所有input元素中类型为image的input元素
$('input:button') 选择所有input元素中类型为button的input元素
$('input:file') 选择所有input元素中类型为file的input元素
$("input:hidden") 选择所有input元素中类型为hidden的input元素
表单元素过滤选择器:
$(":enabled") 选择所有的可操作的表单元素
$(":disabled") 选择所有的不可操作的表单元素
$(":checked") 选择所有的被checked的表单元素
$("select option:selected") 选择所有的select 的⼦元素中被selected的元素
以上所述是给⼤家介绍的jQuery选择器总结之常⽤元素查⽅法,希望对⼤家有所帮助,如果⼤家有任何疑问
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论