JQuery中的选择器

JQuery的引入

1.本地引入

<script type="text/javascript" src="jquery.js"></script>

2.远程引入

<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery1.4.min.js">
</script>

JQuery中的$

在jQuery库中，$就是jQuery的一个简写形式。
如：

$('id') ==>  jQuery('#id')

在编写JavaScript时应尽量避免使用jQuery和$定义变量或方法，
以免在同时使用JavaScript和jQuery时发生冲突。

JQuery选择器

1.基本选择器

• 通配符选择器
  选择页面内所有元素

$('*')

• id选择器
  根据指定id匹配元素

$('#id')

• 类选择器
  根据类名匹配元素

$('.class')

• 元素名选择器
  根据元素名匹配元素

$('div')

• 分组选择器
  分组匹配元素

 $('div,span,.hotclass')

2.层次选择器

• 选择E1下所有E2

$('E1 E2')

• 选择E1下的直接子元素

$('E1> E2')

• 选择E1后紧邻的一个兄弟元素

$('E1+ E2')
//等同于
$(E1).next(E2)

• 选择E1后所有的兄弟元素

$('E1~ E2')
//等同于
$(E1).nextAll(E2)

3.过滤选择器

主要是通过特定的过滤规则来筛选出需要的DOM
元素，过滤规则与CSS中的伪类选择器语法相
同，即过滤选择器都是以冒号(:)开头。

3.1 、基本过滤选择器

选择器	描述
:first	选择第一个元素
:last	选择最后一个元素
:not(E1)	去除所有E1选择器匹配的元素
:even	选择索引是偶数的所有元素，索引从0开始
:odd	选择索引是奇数的所有元素，索引从0开始
:eq(index)	选择索引值是index的元素，index从0开始
:gt(index)	选择索引值大于index的元素,index从0开始
:lt(index)	选择索引值小于index的元素,index从0开始
:header	选择所有的标题元素,h1~h6
:animated	选择当前正在执行动画的所有元素

3.2、内容过滤选择器

选择器	描述
:contains(text)	选择含有text文本内容的元素
:empty	选择不包含子元素或文本的空元素
:has(E1)	选择包含有(E1选择器匹配的元素)的所有元素
:parent	选择含有子元素或文本的元素

3.3 、可见性过滤选择器

选择器	描述
:hidden	选择所有不可见元素
:visible	选择所有可见元素

3.4 、属性过滤选择器

选择器	描述
[attribute]	选择拥有此属性的元素
[attribute=value]	选择属性值为value的元素
[attribute!=value]	选择属性值不为value的元素
[attribute^=value]	选择属性值以value开始的元素
[attribute$=value]	选择属性以value值结束的元素
[A1][A2]…A[N]	用属性选择器合并成一个复合属性选择器。满足多个条件。

3.5 、子元素过滤选择器

选择器	描述
:nth-child(index/even/odd)	选取每个父元素下的第index素或奇偶元素.(indexc从1开始)
:first-child	选择每个父元素的第1个子元素
:last-child	选择每个父元素的最后1个子元素
:only-child	如果某个元素是它父元素中惟一的子元素,那么将会被匹配.素中含有其他元素,则不会

:nth-child()选择器详细功能描述:
1.:nth-child(even)能选择每个父元素下的索引值是偶数的元素
2.:nth-child(odd)选择出每个父元素下的索引值是奇数的元素
3.:nth-child(2)选取每个父元素下的索引值等于2的元素
4.:nth-child(3n)能选出每个父元素下的索引值是3的倍数的元素,n从0开始
5.:nth-child(3n+1)能选取每个父元素下的索引值是3n+1的元素.n从0开始

3.6 、表单对象属性过滤选择器

选择器	描述
:enabled	选择所有可用元素
:disabled	选择所有不可用元素
:checked	选择所有被选中的元素(单选框,复选框)
:selected	选择所有被选中的选项元素(下拉列表)

4、表单选择器

选择器	描述
:input	匹配所有input、textarea、select、button元素
:text	选择所有单行文本框
:password	选择所有密码框
:radio	选择所有单选框
:checkbox	选择所有复选框
:submit	选择所有t提交按钮
:image	选择所有图像按钮
:reset	选择所有重置按钮
:button	选择所有按钮
:file	匹配所有文件域
:hidden	匹配所有不可见元素

访问链接获得所有版本JQuery