JQuery查找标签

Posted 2020-11-16 randysun

JQuery查找标签

一、基本标签

1 id选择器：

$("#id(名称)")

$("#cent")

2 标签选择器：

$("tabName(便签名称)")

$("a")

3 class选择器：

$(".class(class选择器名称)")  

$(".b")

4 配合使用：

$("标签名称.选择器")  // 找到有c1 class类的div标签

$("div.c")

5 所有元素选择器：

$("*")

6 组合选择器：

$("id选择器, class选择器, 标签选择器")

二、层级选择器：

1 x的所有后代y（子子孙孙

$("选择器1  选择器2")

$("x y"); // 只要选择器2

2 x的所有儿子y（儿子）

$("选择器1 > 选择器2")

$("x > y"); // 只要儿子

3 找到所有紧挨在x后面的y

$("选择器1 + 选择器2")

$("x + y")；// (一个)

4 x之后所有的兄弟y

$("选择器1 ~ 选择器2")

$("x ~ y")；//(多个)

三、基本筛选器

1 第一个

:first

2 最后一个

:last

3 索引等于index的那个元素

:eq(index)

4 匹配所有索引值为偶数的元素，从 0 开始计数

:even

5 匹配所有大于给定索引值的元素

:odd

6 匹配所有小于给定索引值的元素

:gt(index)

移除所有满足not条件的标签

:lt(index)

7 移除所有满足not条件的标签

:not(元素选择器)

8 选取所有包含一个或多个标签在其内的标签(指的是从后代元素找)

:has(元素选择器)

四、属性选择器

$("tagName[attrbute]")
$("tagName[attrbute=name]")// 属性等于

[attribute!=value]// 属性不等于

$("input[type=text]")

$("input[type]")

五、表单筛选器

$(":text") 
$(":password") 
$(":file") 
$(":radio") 
$(":checkbox")  // 找到所有的checkbox


$(":submit") 
$(":reset") 
$(":button") 

表单对象属性:
$(":enabled") 
$(":disabled") 
$(":checked") 
$(":selected")

• 找到可用的input标签

<form>
  <input name="email" disabled="disabled" />
  <input name="id" />
</form>

$("input:enabled")  // 找到可用的input标签

• 找到被选中的option:

<select id="s1">
  <option value="beijing">北京市</option>
  <option value="shanghai">上海市</option>
  <option selected value="guangzhou">广州市</option>
  <option value="shenzhen">深圳市</option>
</select>

$(":selected")  // 找到所有被选中的option

六、筛选器方法

1 下一个元素：

$("#id").next() // 下一个标签
$("#id").nextAll() // 标签下面的全部
$("#id").nextUntil("#i2") // 两者之间

2 上一个元素：

$("#id").prev() // 上一个标签
$("#id").prevAll() // 上一个标签全部
$("#id").prevUntil("#i2") // 两者之间

3 父亲元素：

$("#id").parent()
$("#id").parents()  // 查找当前元素的所有的父辈元素
$("#id").parentsUntil() // 查找当前元素的所有的父辈元素，直到遇到匹配的那个元素为止。

4 儿子和兄弟元素：

$("#id").children();// 儿子们
$("#id").siblings();// 兄弟们

5 查找

$("div").find("p") ===>等价于$("div p")

6 筛选

筛选出与指定表达式匹配的元素集合。这个方法用于缩小匹配的范围。用逗号分隔多个表达式

$("div").filter(".c1")  ===> 等价于 $("div.c1")  // 从结果集中过滤出有c1样式类的

7 补充

.first() // 获取匹配的第一个元素
.last() // 获取匹配的最后一个元素
.not() // 从匹配元素的集合中删除与指定表达式匹配的元素
.has() // 保留包含特定后代的元素，去掉那些不含有指定后代的元素。
.eq() // 索引值等于指定值的元素