码迷,mamicode.com
首页 > Web开发 > 详细

jQuery选择器概述

时间:2016-07-11 09:05:21      阅读:206      评论:0      收藏:0      [点我收藏+]

标签:

1、基本选择器:
1) #id : 根据给定的id匹配一个元素;
2) .class: 根据给定的类名匹配元素;
3)element: 根据给定的元素名匹配元素;
4)* : 匹配所有元素;
5)selector1,selector2,...,selectorN: 将每个选择器匹配到的元素合并后一起返回

 

2、层次选择器:
1) $("ancestor descendant") : 选取ancestor元素里的所有descendant(后代)元素;
如:$("div span")选取<div>里的所有的<span>子元素

2) $("parent>child"): 选取parent元素下的所有child元素,与 $("ancestor descendant")有区别, $("ancestor descendant")选择的是后代元素;
如:$("div>span")选取<div>元素下 元素名是<span>的子元素

3) $("prev + next"): 选取紧接在prev元素后的next元素;
如:$(".one+div") 选取class为one的 下一个<div>同辈元素
可使用next()方法代替,如:$(".one")。next("div");

4) $("prev ~ siblings"): 选取prev元素之后的所有siblings元素
如:$("two ~ div") 选取id为two的元素后面所有的<div>同辈元素
可使用nextAll()方法代替,如:$("two")。nextAll("div");

 

3、过滤选择器:
1)基本过滤选择器:
:even------选取索引是偶数的所有元素,索引从0开始;
:odd------选取索引是奇数的所有元素,索引从0开始;
:gt(index)------选取索引大于index的元素,index从0开始;
:lt(index)------选取索引小于index的元素,index从0开始;
2) 内容过滤选择器:
:contains(text)---选取含有文本内容为“text”的元素
:empty------选取不包含子元素或者文本的空元素
:parent------选取含有子元素或者文本的元素
3)子元素过滤选择器:
:nth-child(index/even/odd/equation)---选取每个父元素下的第index个子元素或者奇偶元素

 

4、 表单选择器:
1) :input------选取所有的<input>,<textarea>,<select>,<button>元素
2) :text------选取所有的单行文本框

jQuery选择器概述

标签:

原文地址:http://www.cnblogs.com/hunterCecil/p/5659109.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!