JQuery选择器
基本选择器
- id选择:
- $("#id")
- 类选择:
- $(".class")
- 元素名选择:
- $("元素名")
- 选择所有元素:
- $("*")
- 以上选择可以叠加,中间用逗号隔开:
- $("div,#one") 选择所有div元素,然后从中选择id为one的元素
层次选择器
- 祖先 后代选择:
- $("祖先A 后代B") 选择以A为祖先 所有的B元素(A中的所有B)
- 子元素选择
- $("父A>子B") 在A中选择B子元素
- 下一个元素选择 (只是兄弟节点,不包过子节点)
- $("A+B") A后面的第一个B
- 后面所有元素选择 (只是兄弟节点,不包过子节点)
- $("A~B") A后面的所有B
过滤选择器
- :first 第一个元素
- $("input:first") 第一个input元素
- :last 最后一个元素
- :not() 不满足条件的元素
- $("div:not(:animated)") 没有进行动画的div元素
下标是从0开始
- :even 下标为偶数的元素
- :odd 下表为奇数的元素
- :gt() greater than 下标比..大的元素
- :eq() equal 下标和..相等的元素
- :lt() less than 下标比..小的元素
- :header 标题元素
- :animated 正在进行动画的元素
内容过滤选择器
- :contains() 包含指定文本的元素
- $("div:contains('Hello')") 文本内容包含hello的元素
- :empty() 不包含文本或者子元素的空元素
- :has() 含有特定元素的元素
- $("div:has(.szx)") 选择含有 class 为 szx 的 div 元素
- :parent() 含有文本或者子元素的元素 不是父元素
可见性选择器
- :visible 选取可见元素
- :hidden 选取不可见元素
属性选择器
- [属性] 选取包含该属性的元素
- [属性='值'] 选取属性等于特定值的元素
- [属性!='值'] 选择属性值不为指定值的元素
- [属性^='值'] 属性值以特定值开始的元素
- $("div[title^='he']") 属性值形如hello,hel,hell都会被匹配
- [属性$='值'] 属性值以特定值结尾的元素
- [属性*='值'] 属性包含特定值的元素