jquery学习之选择器
一、Jquery选择器是什么
1、css选择器
|
a
、
tag
|
td
|
|
b
、
id
|
#note
|
|
c
、类
|
.note
|
|
d
、群组
|
Td,p,div
|
|
e
、后代
|
#link a
|
|
f
、通配符
|
*
|
2、jquery选择器
jquery
选择器获取到的是对象，因此不能直接用来做判断，需要做处理才可以：
If($("#tt")){
//do something
}
这样的写法是错误的，因为 $("#tt")是一个对象，可以这样写
if($("#tt").length >0 ){
//do something
}
二、Jquery选择器
1
、基本选择器：
|
选择器
|
描述
|
返回
|
例子
|
|
#id
|
指定的
id
|
单个元素
|
$("#test")
|
|
.class
|
指定的类匹配的元素
|
集合元素
|
$(".test")
|
|
Element
|
指定的元素名称
|
集合元素
|
$("p")
|
| Selector1,selector2…… |
多个选择器选择后合并返回
|
集合元素
|
$("div,span,p.myclass")
|
2
、层次选择器：
|
选择器
|
描述
|
返回
|
例子
|
|
$("div span")
|
选取div里面的所有的span元素 |
集合元素
|
|
|
$("div > span")
|
选取div下面的所有的tag为span的子元素 |
集合元素
|
|
|
$(".one + div")
|
选取类为.one元素后尽跟的所有div元素 |
集合元素
|
可以使用next()方法代替 |
|
$("#two~div")
|
选取id为two元素后面的所有的div元素 |
集合元素
|
可以使用nextall()方法代替 |
3、过滤选择器(基本)
|
选择器
|
描述
|
返回
|
例子
|
|
:first
|
选取第一个元素
|
单个元素
|
$("div:first")
|
|
:last
|
选取最后一个元素
|
单个元素
|
$("div:last")
|
|
:not()
|
取出匹配的选择器
|
集合元素
|
$("div:not(.myclass)")
|
|
:even
|
选取索引是偶数的所有元素
|
集合元素
|
$("div:even")
|
|
:odd
|
选取索引是奇数的所有元素
|
集合元素
|
$("div:odd")
|
|
:eq(index)
|
选取索引等于index的元素 |
单个元素
|
$("div:eq(1)")
|
|
:gt(index)
|
选取索引大于index的元素 |
集合元素
|
$("div:gt(1)")
|
|
:lt(index)
|
选取索引小雨index的元素 |
集合元素
|
$("div:lt(1)")
|
|
:header
|
选取所有的标题元素例如
h1
，
h2
，
h3
|
集合元素
|
$(":header")
|
|
:animated
|
选择当前正在执行动画的所有元素
|
集合元素
|
$("div:animated")
|
4
、过滤选择器（内容）
|
选择器
|
描述
|
返回
|
例子
|
|
:contains(text)
|
选取含有文本内容为text的元素 |
集合元素
|
$("div:contains('我')") |
|
:empty
|
选取不包含子元素或者文本的空元素
|
集合元素
|
$("div:empty")
|
|
:has(select)
|
选取含有选择器的所匹配的元素的元素
|
集合元素
|
$("div:has(p)")
|
|
:parent
|
选取含有子元素或者文本的元素
|
集合元素
|
$("div:parent")
|
5
、可见性过滤选择器
|
选择器
|
描述
|
返回
|
例子
|
|
:hidden
|
选取隐藏的元素
|
集合元素
|
$(":hidden")
|
|
:visible
|
选取可见的元素
|
集合元素
|
$("div:visible")
|
6
、属性过滤选择器
|
选择器
|
描述
|
返回
|
|
$("div[id]")
|
选取拥有此属性的元素
|
集合元素
|
|
$("div[title=test]")
|
选取属性title为test的元素 |
集合元素
|
|
=!
|
不等于
|
集合元素
|
|
^
|
以某值开始
|
集合元素
|
|
$
|
以某值结束
|
集合元素
|
| · |
属性含有value的元素 |
集合元素
|
|
$("div[id][title='test']")
|
多重选择
|
集合元素
|
7
、子元素过滤选择器
|
选择器
|
描述
|
返回
|
|
|
选取每个父元素下的第几个子元素，或偶数，奇数
|
集合元素
|
|
:first-child
|
选取每个父元素的第一个子元素
|
集合元素
|
|
:last-child
|
选取每个父元素的最后一个子元素
|
集合元素
|
|
:only-child
|
选取仅仅有一个子元素的父元素
|
集合元素
|
8
、表单对象属性过滤选择器
|
选择器
|
描述
|
返回
|
|
:enabled
|
选取所有可用元素
|
集合元素
|
|
:disabled
|
选取所有不可用元素
|
集合元素
|
|
:checked
|
选取所有被选中的元素
|
集合元素
|
|
:selected
|
选取所有被选中的选项元素
|
集合元素
|
9
、表单选择器
|
选择器
|
描述
|
|
:input
|
选取所有的
input textaera select button
|
|
:text
|
选取所有的单行文本框
|
|
:password
|
选取所有的密码框
|
|
:radio
|
选取所有的单选框
|
|
:checkbox
|
选取所有的多选框
|
|
:submit
|
选取所有的提交按钮
|
|
:image
|
选取所有的图像按钮
|
|
:reset
|
选取所有的重置按钮
|
|
:button
|
选取所有的按钮
|
|
:file
|
选取所有的上传域
|
|
:hidden
|
选取所有的不可见元素
|