jQuery、CSS常用选择器
符号 描述 示例 说明
紧接无符号 相当于”并且“关系 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很好很強大

說的太繞口了。以免誤人子弟,請自查閱文檔。


本文转载:CSDN博客