jQuery入门学习笔记----第二章 jQuery选择器

jQuery选择器详解

一，基本选择器

<strong>/*分别是id选择器，元素选择器，类选择器，匹配所有元素，合并选择器*/$(function(){    $("#id").html("hello world");   //print 等同innerHTML})$(function(){    $("div p").html("hello world");})$(function(){    $(".class").html("hello world");})$(function(){    $("*").html("hello world");})$(function(){    $("#id,p").html("hello world");})</strong>

二，层次选择器

$("#id p")//匹配后代元素。即id的后代（无论多少代）$("#id->p")//id的子元素。仅一代$("#id+p")$("#id").next()//下一个相邻的元素$("#id").nextAll()$("#id").prevAll()$("#id").prev()$("#id").preUntil(elemnet)//区间$("#id").nextUntil(element)$("#id~p")//之后的所有兄弟元素$("#id").siblings//所有的兄弟元素，不论前后

三，简单过滤选择器

$("li:first")//获取第一个元素$(“li”).first()$("li:last")//最后一个$("li:not(.NotClass)")//NotClass是一个类名，去除NotClass的其他元素$("li:even")//偶数，注意li索引值是从0开始$("li:odd")//奇数$("li:eq(1)")//指定索引值为1的$("li:gt(1)")//大于1$("li:lt(4)")//小于4$(":header")//选择标题类元素$("#spanMove:animated")//选择id为spanMove的元素。获取正在执行动画效果的元素。选择器animated在捕捉动画效果元素时，先自定义一个动画效果函数animateIt(),然后执行该函数，选择器才能获取动画效果元素。

四，内容过滤选择器

:contains(text)

获取包含给定文本的元素

:empty

获取所有不包含子元素或者文本的空元素

:has(selector)(span,.classname,#idname)

获取含有选择器所匹配的元素的元素

:parent

获取含有子元素或者文本的元素

.filter(selector)

获取含有选择器所匹配的元素的元素

.not(selector)

跟上面的相反

 

五，可见性过滤选择器

:hidden

获取所有不可见元素，或者type为hidden的元素

:visible

获取所有可见元素

 

六，属性过滤选择器

[attribute]

包含给定属性的元素

[attribute=value]

等于给定元素

[attribute!=value]

不等于

[attribute^=value]

开头是

[attribute$=value]

结尾是

[attribute*=value]

含有

[selector1][selector2][selector3]

同时满足1,2,3

 

七，子元素过滤选择器

a:nth-child(eq|even|odd|index)

获取每个父元素下的特定位置元素，索引号从1开始

:first-child

 

:last-child

 

:only-child

获取每个父元素下的仅有一个子元素

P.S这里是指a的父元素

 

八，表单对象属性过滤选择器

:enabled

获取表单中所有属性为可用的元素

:disabled

不可用

:checked

被选中  这个是checkbox的

:selected

被选中option的元素   这个是select里面的option

P.S：表单对象就是那些input，select之类啥的，让你输入让你选择的那些

例子：

$(“#form1 input:enable”)

$(“select option:selected”)

 

九，表单选择器

:input

获取所有input，textarea，select

:text

所有单行文本框

:password

密码框

:radio

单选框

:checkbox

复选框

:submit

提交按钮

:image

图像域  <input type=”image” title=”Image” src=””/>

:reset

重置按钮

:button

按钮

:file

文件域  <input type=”file” />我们上传东西那个预览