CSS选择器

《精通jquery》笔记
CSS选择器分为：
核心选择器，属性选择器，关系选择器，伪元素和伪类选择器，联合选择器和反选择器

---

一、核心选择器

*                                      选择文档中所有元素
<type>                                 选择特定类型元素
.<class>                               选择具有特定class的元素，与元素类型无关
<type>.<class>                         选择具有特定class的某类元素
#<id>                                  选择具有特定id属性值的元素

---

二、属性选择器
基于属性选取元素的选择器

[arrt]                            选取定义了attr属性的元素，即使这个属性没有值
[arrt="val"]                      选取attr属性值等于字符串val的元素
[arrt^="val"]                     选取attr属性值以val开头的元素
[arrt$="val"]                     选取attr属性值以val结尾的元素
[arrt*="val"]                     选取attr属性值包含val的元素
[arrt~="val"]         选取attr属性值包含空格分隔的多个值，且其中一个值为val的元素
[arrt|="val"]        选取attr属性值等于字符串val，或属性值为连字符分隔的字列表且第一个是val的元素

---

三、关系选择器
基于DOM对象的层级关系选取元素

两种兄弟元素选择器：^ 和 ~ 
<selector1> <selector2>          1匹配的元素内匹配2的后代元素
<selector1> > <selector2>        1匹配的元素内匹配2的直接子元素
<selector1> + <selector2>        1匹配的元素内匹配2的下一个兄弟元素，即两个选择器匹配到的元素为兄弟关系
<selector1> ~ <selector2>　      1匹配的元素之后的所有匹配2的兄弟元素，即选择1匹配元素后面的所有兄弟元素

---

四、伪元素和伪类选择器
伪元素和伪类在页面中无法找到

:active                     选取用户激活的当前元素，一般是鼠标点击的元素
:checked                    选取处于选中状态的元素
:default                    选取默认的元素
:disabled                   选取处于禁用状态的元素
:empty                      选取没有任何内容的元素
:enabled                    选取处于可用状态的元素
:first-child                选取元素的第一个子元素
:first-letter               选取文本的第一个字母
:first-line                 选取文本的第一行
:focus                     选取得到焦点的元素（接收键盘事件或其他用户输入的元素）
:hover                      获取鼠标悬停位置的元素
:in-range :out-off-range    获取指定范围之内/之外的input元素
:lang(<language>)           获取lang属性为<language>的元素
:last-child                 获取元素的最后一个子元素
:link                       获取链接元素
:nth-child(n)               获取元素的第n个子元素
:nth-last-child(n)          获取元素的倒数第n个子元素
:nth-of-type(n)             获取元素中同类型子元素的第n个元素
:nth-last-type(n)           获取元素中同类型子元素的倒数第n个元素
:only-child                 选取元素中唯一的子元素
:only-of-type               获取元素中唯一且与指定类型相同的那个子元素
:required                   获取具有required属性的元素
:optional                   获取缺少required属性的元素
:root                       获取文档的根元素
:target                     获取URL中锚点引用的元素
:valid                      获取表单中通过验证的input元素
:invalid                    获取表单中未通过验证的input元素
:visited                    获取用户已经访问过的链接元素

---

四、联合选择器和反选择器

<seclector>,<selectot>              选取匹配第一个和匹配第二个选择器的元素
not:(<selector>)                    选取除匹配指定选择器之外的元素