符号 | 描述 | 示例 | 说明 |
---|---|---|---|
紧接无符号 | 相当于”并且“关系 | input.k-textbox{ ... } |
选出input并且包含k-textbox类的元素 |
, (逗号) | 选择器分格符, 选择多种元素 | h1, h2{ ... } |
选出h1 和 h2 的所有元素 |
. (圆点) | 类选择器 | .k-textbox{ ... } |
选出包含k-textbox类的元素 |
*(星号) | 所有元素 | *{ ... } |
选择所有的元素 |
# (井号) | ID选择器 | #mem-id{ ... } |
选择 ID 为 mem-id 的元素 |
[ ] (中括号) | 属性选择器 | h1[class='k-textbox']{ ... } |
选择h1并且包含k-textbox类的元素 |
(空格) | 后代选择器 | #container h1{ ... } |
选择 ID 为 container 内的所有为h1后代元素 |
> (大于号) | 子元素选择器 | #container>h1{ ... } |
选择 ID 为 container 内的所有为h1的子元素(仅限子元素,孙的不计) |
+ (加号) | 后面紧挨的兄弟选择器 | #mem-id+h1{ ... } |
选择 ID 为 mem-id 的后面 "紧挨" 的h1元素 |
~ (波浪线) | 兄弟元素选择器 | #mem-id~h1{ ... } |
选择ID 为 mem-id 的所有h1兄弟元素 |
: 或 :: | 伪类 |
参考资料:http://hi.baidu.com/vguishjxghimpxs/item/e893c42510a1c5102a0f1c54
在選擇器里面幾種符號
1,(逗號)
2 (空格)
3.(英文句號)
4>(大于號)
5+(加號)
6~(波浪號)
- 逗號
各選擇器之間用逗號分開 匹配查詢的時候 之間是 “或”的關系
- 空格
在用空格前的selector匹配的結果里面 用空格后面的selector 做結果的全局匹配
- 英文句號
匹配的是class(class='style')
- 大于號
用大于號后面的selector對前面的結果在子內容 做同維度匹配
- 加號
匹配結果 用加號后面的 selector 對前面的結果同一級的內容做全局匹配
- 波浪好
匹配結果 用加號后面的 selector 對前面的結果同一級的內容做同級匹配
特別說明的
1 空格與大于號
“空格”和“大于號”都是對前面的匹配結果的子內容做匹配。不同的是“空格”做的是子內容和孫內容匹配,而“大于號”只對子內容做匹配
2 加號與波浪號
“加號”和“波浪好” 都是對前面匹配結果的同一級內容做匹配。不同的跟上面的差別一樣,“加號”是子孫內容,而“波浪號”只是子內容
這只是部分jquery的selector
后面看完后覺得jquery的selector很好很強大
說的太繞口了。以免誤人子弟,請自查閱文檔。