第三节 选择器

来源:互联网 发布:域名购买哪家网站靠谱 编辑:程序博客网 时间:2024/06/05 08:42

一.基本

1.#id
例:$(‘#id’)

2.element
例:$(‘div’)

3..class
例:$(‘.myclass’)

4.* 匹配所有元素
例:$(‘*’)

5.select1,select2 组合(将每一个选择器匹配到的元素合并后一起返回。)
例:$(‘div,span,myclass’)

二.层级

1.ancestor descendant
在给定的祖先元素下匹配所有的后代元素
例:$(‘form input’)
2.parent > child
在给定的父元素下匹配所有的子元素
例:$(‘form > input’)
3.prev+next
匹配所有紧接在 prev 元素后的 next 元素
例:$(“label + input”)
4.prev~siblings
匹配 prev 元素之后的所有 siblings 元素
例:$(“form ~ input”)

三.基本筛选器

1.:first
获取第一个元素
2.:last
获取最后一个元素
3.:not
获取除了这个元素
4.:eq
获取第几个元素
5.:lt(index)
匹配所有小于给定索引值的元素
6.:gt(index)
匹配所有大于给定索引值的元素
7.:even
匹配所有索引值为偶数的元素,从 0 开始计数
8.:odd
匹配所有索引值为奇数的元素,从 0 开始计数

四.内容

1.:has(selector)
匹配含有选择器所匹配的元素的元素
例:$(‘div:has(p)’)找到含有p标签的div元素
2.:empty()
匹配所有不包含子元素或者文本的空元素
3.:parent = not empty()
匹配含有子元素或者文本的元素

五.子元素

1.:first-child
匹配所给选择器( :之前的选择器)的第一个子元素
类似的 :first 匹配第一个元素,但是:first-child选择器可以匹配多个:即为每个父级元素匹配第一个子元素。这相当于:nth-child(1)

2.:last-child
匹配最后一个子元素
:last 只匹配最后一个元素,而此选择符将为每个父元素匹配最后一个子元素

3.:nth-child
匹配其父元素下的第N个子或奇偶元素
:eq(index) 匹配选择器指定序列的元素,而这个将为每一个父元素匹配子元素。

4.:only-child
如果某个元素是父元素中唯一的子元素,那将会被匹配
如果父元素中含有其他元素,那将不会被匹配。(注:这里的其他元素并不包含文本节点,如:

<p><img/>图片</p>,用$('p img:only-child')是

可以匹配)

六.表单

1.:input
匹配所有 input, textarea, select 和 button 元素
2.:text
匹配所有的单行文本框
3.:password
匹配所有密码框
4.:radio
匹配所有单选按钮
5.:checkbox
匹配所有复选框
6.:submit
匹配所有提交按钮
7.:image
匹配所有图像域
8.:reset
匹配所有重置按钮
9.:button
匹配所有按钮
10.:file
匹配所有文件域

七.表单对象属性

1.:enabled
匹配所有可用元素
2.:disabled
匹配所有不可用元素
3.:checked
匹配所有选中的被选中元素(复选框、单选框等,select中的option),对于select元素来说,获取选中推荐使用 :selected
4.:selected
匹配所有选中的option元素

1 0
原创粉丝点击