1.原生选择符
1.标签选择符 $('p')
2.ID
选择符 $('#some-id')
3.类选择符 $('.some-class')
4.否定式伪类选择符 $('#some-id li:not(.some-class)')
5.属性选择符$('img[alt]')
,属性选择符使用一种从正则表达式借鉴来的通配符语法,以 ^
表示值在字符串的开始位置,以 $
表示值在字符串的结尾,用 *
号表示要匹配的值可以出现在字符串的任意位置,用叹号 !
表示对值取反。
eg:$('a[href^="mailto:"]')
选中所有电子邮件的链接。$('a[href$=".pdf"]')
选中所有pdf文件的链接。
属性选择符也可以组合使用,例如,可以为 href
属性以 http
开头且任意位置包含 henry
的所有链接 $('a[href^="http"][href*="henry"]')
2.自定义选择符
jquery
中的多数自定义选择符都可以让我们从已经找到的元素中选出一个或多个元素。自定义选择符通常跟在一个 css
选择符的后面,基于已经选择的元素集的位置来查找元素。自定义选择符的语法与 cs
s 中的伪类选择符语法相同,即选择符以冒号(:)开头。
例如。我们想要选取带 class
伪类的 div
集合中的 第2项,那么应该使用以下的代码:$('div.class:eq(1)')
注意:js
中的数组采用的是从 0
开始的编号方式,所以 eq(1)
取得是集合中的第二个元素。而 css
则是从 1
开始的,因此 css
选择符 $('div:nth-child(1)')
取得的是作为其父元素第一个子元素的所有 div
元素,nth-child()
可以接受 odd
或者是 even
为参数。eq()
,:odd
和 :even
都使用js
内置从 0
开始的编号方式。所以如果你想选择一个表格中的所有偶数行可以这样写: $('tr:even')
(注意,这里是 even
而不是 odd
)
3.基于上下文的内容选择元素
$('td:contains(hello)')
所有单元格中的 hello
字段都会被选中。
4.基于表单的选择符
:input 输入字段、文本区、选择列表和按钮元素
:button 按钮元素或 type 属性值为 button 的输入元素
:enabled 启用的表单元素
:disabled 禁用的表单元素
:checked 勾选的单选按钮或复选框
:selected 选择的选项元素
$('input[type="radio"]:checked')
$('input[type="password"],input[type="text"]:disabled')