jQuery常用选择器总结
jQuery常用选择器总结:
我们都知道jQuery是JavaScript(JS)的框架,它的语法简单使用方便,被广大开发人员青睐。现在我就它常用的并且十分强大的选择器的方式,做一个总结。鉴于它的选择器方式众多,我就自己平时工作之中所遇到的常见的方式做一个总结。
一,元素查找方式:
- $("#myElement") 选择id为myElement的元素,因为id在使用中是唯一的,所以这样的选择也是指定的不变的。
- $("div") 选择所有的div标签元素,返回div数组。
- $(".myClass") 选择class名为myClass所有的css标签元素。
- $("*") 选择文档中的所有元素,也可以运用联合选择方式进行选择,例如:$("#myElement,div,.myClass")。
二,层叠选择器:
- $("form input") 选择所有inform元素下的input元素。
- $("#main > *") 选择id为main元素下的所有子元素。
- $("label + input") 选择所有label元素的下一个input元素节点。
- $("#pre ~ div") 同胞选择器,选择id为pre元素下的所有属于同一个父元素的div标签。
三,基本过滤选择器:
- $("tr:first") 选择tr元素的第一个节点。
- $("tr:last") 选择tr元素的最后一个节点。
- $("input:not(:checked) + span") 过滤掉checked选择器的所有的input元素。
- $("tr:even") 选择所有的tr元素的第0,2,4,.....个元素。
- $("tr:odd") 选择所有的tr元素的第1,3,5,......个元素。
- $("td:eq(2)") 选择所有的td元素中序号为二的那个td元素。
- $("tr:get(4)") 选择所有的td元素中序号大于4的那些td元素。
- $("tr:ll(4)") 选择所有的td元素中序号小于4的那些td元素。
四,表单过滤选择器:
- $(":input") 选择所有的表单输入元素,包括input,textarea,select,button。
- $(":text") 选择所有的text input元素。
- $(":input") $(":password") 选择所有的password input元素。
- $(":radio") 选择所有的radio input元素。
- $(":checkbox") 选择所有的checkbox input元素。
- $(":submit") 选择所有的submit input元素。
- $(":image") 选择所有的image input元素。
- $(":reset") 选择所有的reset input元素。
- $(":button") 选择所有的button input元素。
- $(":file") 选择所有的file input元素。
- $(":hidden") 选择所有的类型为hidden的input元素或者表单隐藏域。
- $(":enabled") 选择所有的可操作的表单元素。
- $(":disabled") 选择所有的不可操作的表单元素。
- $(":checked") 选择所有的被checked的表单元素。
- $("select option:select") 选择所有的select的子元素中被select的元素。
jQuery的选择器中层叠过滤先择器是常用的并且复杂的选择器之一,在这里就没有大篇幅的去总结了,因为就上面的各种选择器方式,运用熟悉了,对开发来说都是足够了的。