2 jquery选择器

一基本选择器
#id
.class
 elment
 * 
select1, select2, select3... 例 $("span, #two").css("background","bbffaa")//改变所有的<span>元素id为two的元素背景色
二层次选择器 
$("div span") div内所有span元素
$("div>span")  div下的span子元素
$(".one+div")  class为One的下一个div同辈元素,返回集合元素,即$("pre+next"),等价于 $(".one").next("div")
$("#two~div")  id为two 的元素后的所有div同辈元素即 $("prev~siblings")等价与 $("#two").nextAll("div")
$("prev~siblings")选择器与siblings()方法的比较:$("prev~siblings")选择器只能选择“prev”后面的同辈div元素,而siblings()方法与前后位置无关。
三过滤选择器(:)
1 基本过滤选择器
:first
:last
:header   //标题
:focus   //  选取当前获取焦点的元素
:animated  //所有动画元素
:even
:odd
:not(selected)
:eq(index)
:gt(index)    //greater than
:lt(index)     //less than
2 内容过滤选择器
:contains(text)
:empty
:has(selector)
:parent  //拥有子元素(包括文本元素)
3 可见性过滤选择器
:hidden
:visible
4 属性过滤选择器
[atttibute]
[atttibute=value]
[atttibute!=value]
[atttibute^=value]  //以value开始
[atttibute$=value]  //以value结尾
[atttibute*=value]  //含有
[atttibute|=value]  //等于或为前缀

   [atttibute~=value]  //用空格分割的含有value的元素


[atttibute1][atttibute2=value][atttibuteN]
[atttibute=value]
5 子元素过滤选择器
:nth-child(index/even/odd/equation)  //选取每个父元素下的第index个子元素或奇偶元素,Index从1计算;
                      eq(index)只匹配一个元素,且从index=0计;
:first-child
:last-child
:only-child  //是唯一的子元素
6 表单对象属性过滤选择器
$(":enabled")             所有的可操作的表单元素 
$(":disabled")            所有的不可操作的表单元素 
$(":checked")            所有的被checked的表单元素 
$("select option:selected") 所有的select 的子元素中被selected的元素 
四表单选择器
$(":input")                  选择所有的表单输入元素,包括input, textarea, select 和 button
$(":text")                     选择所有的text input元素 
$(":password")           选择所有的password input元素 
$(":radio")                   选择所有的radio input元素 
$(":checkbox")            选择所有的checkbox input元素 
$(":submit")               选择所有的submit input元素 
$(":image")                 选择所有的image input元素 
$(":reset")                   选择所有的reset input元素 
$(":button")                选择所有的button input元素 
$(":file")                     选择所有的file input元素 
$(":hidden")               选择所有类型为hidden的input元素或表单的隐藏域  
五注意事项
1 选择器中含有“.”,"#","(","]"等特殊字符---要用转义符转义
2 属性选择器中的@符号
3 选择器中的空格
例:var $a=$(".test  :hiddden")//带空格,表示class为test里面的所有隐藏元素,是后代选择器
  var $b=$(".test:hiddden")//不带空格,隐藏的class为test 的元素,是过滤选择器
 4 注意$("#form :input")与$("#form input")
posted @ 2015-11-21 20:20  hou_hou  阅读(213)  评论(0编辑  收藏  举报