jQuery是一种强大的前端技术,封装好js的函数库(前端框架)。jQuery具备很多的优势,其中浏览器兼容、开源是jQuery最大的两个优势。
jQuery中的选择器:
css选择器:
类选择器、id选择器、标签选择器、通配选择器。
jQuery选择器:
优点:
简洁的写法 $()
支持CSS1到CSS3选择器
完善的处理机制
基本选择器:
|
层次选择器:
选择器 | 描述 | 返回 | 示例 |
$("ancestor descendant ") | 选取ancestor元素里的所有descendant(后代)元素 | 集合元素 | $("div span")选取<div>里所有的<span>元素 |
$("paren>child") | 选取parent元素里的所有子元素 | 集合元素 | $("div >span")选取<div>里元素名是<span>的子元素 |
$("prev+next") | 选取prev的下一个兄弟 | 集合元素 | $(".one +div")选取class为one的下一个div元素 |
$("prev ~siblings") | 选取prev后面的所有兄弟 | 集合元素 | $("#two ~div")选取id为two的元素后面的所有div兄弟元素 |
过滤选择器:
基本过滤选择器:
:first
:last
:odd 获取索引是奇数的所有元素,索引从0开始
:even 获取索引是偶数的所有元素,索引从0开始
:not(selector) 去除所有与给定选择器匹配的元素
:eq(index) 获取索引等于index的元素
:gt(index) 获取索引大于index的元素
:lt(index) 获取索引小于index的元素
:header 选取所有标题元素
:animated 选取当前正在执行动画的元素
内容过滤选择器:
:contains(text) $("div:contains("我")")选取含有文本我的div元素
:empty $("div:empty")选取不包含子元素(包括文本元素)的div空元素
:has(selector) $("div:has(p)")选取含有<p>元素的div元素
:parent $("div:parent")选取拥有子元素(包括文本元素)的div元素
子元素过滤过滤选择器(:前要打空格):
:nth-child(index\odd\even\equation) 为每一个父元素匹配子元素,索引从1开始
:first-child
:last-child
:only-child
表单对象属性过滤选择器:
:enabled 选取所有可用元素
:disabled 选取所有不可用元素
:checked 选取所有被选中的元素(单选框,复选框)
:selected 选取所有被选中的元素(下拉列表)
表单选择器:
:text
:input
:image
:submit
:button
:file
:radio
:reset
:checkbox
:hidden