1、利用标签名获取元素
$("标签名")
2、通过ID获取元素
$("#id_name")
3、通过 类名获取元素
$(".className")
4、一次性获取多个元素
$("元素名, 元素名, 元素名 ....")
5、通过指定层次关系获取元素
$("祖先 子孙")
$("父 > 子")
$("前 + 后")
$("兄 ~ 弟")
6、根据元素的属性值获取元素
[attribute]
[attribute = value]
[attribute != value]
[attribute ^= value]
[attribute $= value]
[attribute *= value]
7、通过过滤器获取元素
$("元素名:过滤器")
过滤器列表
:first
:last
:not(filter)
:even
:odd
:eq(index)
:lt(index)
:gt(index)
:header
:animated
:contains(text)
:empty
:has(selector)
:parent【注:这个是获取非空元素不是父元素】
8、获取表单元素
$(":表单过滤器名")
获取表单元素的方法
:input
:text
:password
:radio
:checkbox
:submit
:image
:reset
:button
:file
【注:表单标签也是标签,同样可以利用标签名获取,不过有些标签类型多样可以加过滤器加以区分。如:$("input:text")】
9、通过过滤器获取表单元素
:enable 获取可输入状态的元素
:disabled 获取不可输入状态的元素
:checked 获取选中元素的元素
:selected 获取下拉框中选中状态的元素
10、从集合元素中通过指定序号获取元素
$("元素名").eq(index)
11、获取指定条件一致的元素
$("元素名").filter(expr)
12、获取指定范围的元素
$("元素名").slice(start,[end])
13、获取与条件表达式一致的元素
$("元素名").is(
expr
)
14、获取元素的下一个元素
$("元素名").next([
expr]
)
15、获取元素的前一个元素
$("元素名").prev([
expr]
)
16、获取元素的父元素
$("元素名").parent([
expr]
)
17、获取元素的子元素
$("元素名").children([
expr]
)
1.基本元素选择器
$(“p”) //选取<p>元素 $(“p.info”) //选取所有class=”info”的<p>元素 $(“p#demo”) //选取id=”demo”的第一个<p>元素
分层选择器:使用这种选择器时,需要传入多个值,并用空格或大于号分隔。例如:
$(“div input”) //选择div下所有的input $(“div > input”) //选择父元素(div)下的子元素(input)
2、基本条件选择器
使用这种选择器时,需要在元素的选择符后加上基本条件运算符,这些条件运算符都是jQuery内置的运算符。例如:
$(“p:first”) //选择第一个段落 $(“p:last”) //选择最后一个段落 $(“tr:even”) //选择偶数表格行 $(“tr:odd”) //选择奇数表格行 $(“input:not(:checked)”) //选择所有未被选中的元素 $(“tr:eq(1)”) //选择索引值为1的表格行 $(“tr:gt(0)”) //选择索引值大于0的表格行 $(“tr:lt(2)”) //选择索引值小于2的表格行 $(“:header”) //选择所有标题元素 $(“:animated”) //选择所有正在执行动画的元素
3、内容条件选择器
使用这种选择器时,需要在元素的后面加上内容筛选运算符。例如: $(“div:contains(„John‟)”) //选择包含‘John’文本的层元素
$(“td:empty”) //选择不包含文本或者子元素的表格单元 $(“div:has(p)”) //选择包含段落元素的层元素 $(“td:parent”) //选择包含文本或者子元素的表格单元
4、可见性条件选择器
使用这种选择器时,需要在元素后面加上可见性条件。例如:
$(“tr:hidden”) //选择所有隐藏的表格行 $(“tr:visible”) //选择所有可见的表格行
5、属性选择器
使用这种选择器时,需要利用元素属性并使用一定条件来进行选择。例如: $(“div[id]”) //选择具有id属性的层
$(“input[name=‟newletter‟]”) //选择具有属性name并且属性值为‘newletter’的表单输入元素 $(“input[name!=‟newsletter‟]”) //选择具有属性name并且属性值不为‘newletter’的表单输入元素 $(“input[name^=‟news‟]”) //选择具有属性name并且属性值以‘news’为起始内容的表单输入内容 $(“input[name$=‟letter‟]”) //选择具有属性name并且属性值以‘letter’为结束内容的表单输入元素 $(“input[name*=‟man‟]”) //选择具有属性name并且属性值包含‘man’内容的表单输入元素 $(“input[id][name$=‟man‟]”) //选择具有属性id和name并且name的值以‘man’为结束内容的表单输入内容
6、子元素选择器
使用这种选择器时,需要加入子元素的选择条件。例如:
$(“ul li:nth-child(2)”) //选择第2个列表项 $(“ul li:nth-child(even)”) //选择偶数索引列表项 $(“ul li:nth-child(odd)”) //选择奇数索引列表项 $(“ul li:nth-child(3n)”) //选择索引值为3的倍数的列表项 $(“ul li:first-child”) //选择第一个列表项 $(“ul li:last-child”) //选择最后一个列表项 $(“ul li:only-child”) //选择列表出现且仅出现一个的列表项
7、表单元素选择器
使用这种选择器时,需要加入代表不同表单元素类型的标示符。例如:
$(“:input”) //选择所有input,textarea,select和button元素 $(“:text”) //选择单行文本框 $(“:password”) //选择密码框 $(“:radio”) //选择单选按钮 $(“:checkbox”) //选择复选框 $(“:submit”) //选择提交按钮 $(“:image”) //选择所有图像域 $(“:reset”) //选择重置按钮 $(“:button”) //选择普通按钮 $(“:file”) //选择文件域 $(“:hidden”) //选择隐藏域 $(“input:enabled”) //选择所有可用元素 $(“input:disabled”) //选择所有不可用元素 $(“input:checked”) //选择所有被选中的复选框和单选按钮 $(“select option:selected”) //选择所有被选中的option