jQuery学习笔记二:选择器与包装集
jQuery之选择器:
a——匹配所有链接(<a>)元素
#specialID——匹配id为specialID的元素
.specialClass——匹配拥有CSS类specialClass的元素
a#specialID.specialClass——匹配id为specialID,拥有CSS类specialClass的链接元素
p a.specialClass——匹配拥有CSS类specialClass,在<p>元素内声明的链接元素
子选择器:
p>a——匹配作为<p>元素的直接子节点的链接。如果链接被嵌套在更深一层,比如在<p>之内的<span>内,则链接不会被选中。
特性选择器:
a[href^=http://]——匹配包含以http://开头的href值的链接(“^”符号用于表示匹配出现在某个值的开头)
a[href$=.pdf]——匹配包含以.pdf结尾的href值的链接(“$”符号用于表示匹配出现在某个值的结尾)
a[href*=jQuery.com]——匹配在任何位置包含jQuery.com值的链接(“*”符号用于表示匹配出现在某个值的任意位置)
form[method]——匹配拥有显示method特性的任何<form>元素(不管特性的值是什么)
input[type=text]——匹配type特性值为text的所有<input>元素
容器选择器:
li:has(a)——匹配包含<a>元素的所有<li>元素(注意:li a匹配的是<li>元素里所有的<a>元素)
位置选择器:
:first——页面最先的匹配 li a:first返回最先的并且在列表<li>项下的链接
:last——页面最后的匹配 li a:last返回最后的并且在列表<li>项下的链接
:first-child——最先的子元素 li:first-child返回每个列表最先的项
:last-child——最后的子元素 li:last-child返回每个列表最后的项
:even或:odd——页面范围内偶数或奇数的匹配元素 li:even返回全部偶数<li>项
:eq(n)——第n个匹配元素(n从0开始)
:nth-child(n)——第n个子节点(n从1开始)
:nth-child(even | odd)——偶数或奇数的子节点
选择器nth-child(n)从1开始计数,而其他选择器从0开始计数。(主要是为了与CSS兼容,但却很容易让人糊涂)
jQuery之包装集
通过jQuery函数(如$(‘#someDiv’))就可得到jQuery的一个包装集,下面主要介绍用于包装集的常用命令语法。
size()——返回包装集里元素的个数
get(index)——获取包装集里的一个或所有匹配元素。如果不指定参数,包装集里的所有元素就以JavaScript数组形式返回;如果指定了下标参数,就返回下标对应的元素。
index(element)——在包装集里查找传入的元素,并返回该元素在包装集里的顺序下标;如果元素不在包装集里,则返回-1。
add(expression)——把表达式参数所指定的元素添加到包装类,表达式可以是选择器、HTML片段、DOM元素或DOM元素数组。
not(expression)——根据表达式参数的值,从包装集里删除元素,如果参数是jQuery筛选选择器,则从包装集里删除任何匹配表达式的元素;如果参数是元素引用,则从包装集里删除该元素。
filter(expression)——利用传入的选择器表达式或筛选函数,从包装集里筛选元素。
slice(begin,end)——创建并返回新的包装集,新包装集包含原始包装集的连续的一部分。
find(selector)——返回新的包装集,包含原始包装集里与传入选择器表达式相匹配的所有元素。注意:原始包装集里元素的后代,会因为与传入的选择器表达式相匹配而被包含在新包装集里。
end()——在jQuery命令链内调用,以便退回到前一个包装集。