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命令链内调用,以便退回到前一个包装集。

相关推荐