常用jquery 选择器

jquery 选择器 如何实用 

使用好jquery选择器，是学习jquery的基础。我们来一起看下有几种选择器可以学习：

1、元素择器

2、层叠选择器

3、过滤选择器

4、表单元素选择器

5、表单元素过滤选择器

元素择器

1. 1

   id选择器

   $('#elementId')

2. 2

   元素选择器

   $('div')  选择的div

   $('span')  选择的span

   $('table')  选择的table

   ........

3. 3

   类选择器

   $('.className')

4. 4

   所有元素选择器

   $('*')

5. 5

   联合元素选择器

   $('#elementId','div','.className')

   END

层叠选择器

1. 1

   选择所有的form元素中的input元素

   $("form input")

2. 2

   选择id值为shiguang的所有的子元素

   $("#shiguang > *") 

3. 3

   同胞选择器

   $("#prev_id ~ div")

4. 4

   下一节点选择器

   $("label + input") 

   END

过滤选择器

1. 偶数行选择器

   $("tr:even") 

2. 奇数选择器

   $("tr:odd") 

3. 等于选择器

   $("td:eq(2)")  

4. 大于选择器

   $("td:gt(4)")

5. 小于选择器

   $("td:ll(4)")  

6. 内容选择器

   1、包含选择器

   $("div:contains('见证时光')")

   2、空选择器

   $("td:empty") 

   3、内含选择器

   $("div:has(p)")  

   4、父选择器

   $("td:parent") 

7. 可见\隐藏选择器

   $("div:visible")

   $("div:hidden") 

8. 属性过滤选择器

   1、含有id的选择器

   $("div[id]") 

   2、属性name等于

   $("input[name='shiguang']")

   3、属性name不等于

   $("input[name!='shiguang']")

   4、属性name以shiguang起始选择

   $("input[name^='shiguang']") 

   5、属性name以shiguang结尾选择

   $("input[name$='shiguang']") 

   6、属性name包含man

   $("input[name*='man']")

   7、属性name结尾man

   $("input[id][name$='man']") 

9. 表单选择器

   $(":input") 

   $(":text") 

   $(":password")

   $(":radio")  

   $(":checkbox") 

   $(":submit")

   $(":image") 

   $(":reset")

   $(":button")

   $(":file")  

   $(":hidden") 

10. 表单元素过滤选择器

    $(":enabled") 

    $(":disabled") 

    $(":checked") 

    $("select option:selected")