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() // 索引值等于指定值的元素

JQuery查找标签的更多相关文章

  1. jQuery查找标签--选择器,筛选器,模态对话框, 左侧菜单栏

    查找标签 选择器: 基本选择器(同css) id选择器 $("#id") 标签选择器 $('tagName') class选择器 $(".className") ...

  2. DOM标签操作与事件与jQuery查找标签

    目录 DOM之操作标签 创建标签对象 标签对象的属性 innerText与innerHTML 标签内部追加内容 属性操作 事件 常用事件 事件绑定 事件案例 jQuery简介 查找标签 基本选择器 属 ...

  3. jQuery 查找标签

    1 基本选择器 2 基本筛选器 3 属性选择器 4 间接选择 1 基本选择器 //id选择器: $("#id") //标签选择器: $("tagName") / ...

  4. jquery查找父元素、子元素(个人经验总结)

    使用js或者jquery查找父元素.子元素经常遇到.可是用起来总容易混淆,这里统一总结了一下,以后用起来相信会方便好多 这里jquery向上查找父元素 用到的方法:closest() parents( ...

  5. jQuery 查找元素1

    jQuery 查找元素1 1. id // 通过id查找 $('#id') 2. class <div class='c1'></div> // 通过class查找 $('.c ...

  6. jQuery 查找元素2

    jQuery 查找元素2 :first <ul> <li>list item 1</li> <li>list item 2</li> < ...

  7. jQuery 查找属性

    jQuery 查找属性 示例: <div xsk='123' > <div xsk='456' > // 具有xsk属性的所有标签 $('[xsk]') // xsk属性等于1 ...

  8. JS BOM DOM对象 select联动 计时器 时间 css操作 节点(标签 ) 查找标签 {前端基础之BOM和DOM}

    前端基础之BOM和DOM 前戏 到目前为止,我们已经学过了JavaScript的一些简单的语法.但是这些简单的语法,并没有和浏览器有任何交互. 也就是我们还不能制作一些我们经常看到的网页的一些交互,我 ...

  9. jQuery-选择器-查找标签

    一.jQuery选择器 jQuery选择器就是帮助我们快速定位到一个或多个DOM节点 1.1  ID选择器 如果某个DOM节点有id属性,利用jQuery查找方式: <script src=&q ...

随机推荐

  1. DataGridView在HeaderCell显示行号

    直接显示在HeaderCell中.,效果如下: 1.RowStateChanged事件触发 2.如果仅用于数据展示,RowStateChanged事件会触发多次,数据量过大会卡死,因此,使用了Colu ...

  2. POJ 1944:Fiber Communications

    Fiber Communications Time Limit: 1000MS   Memory Limit: 30000K Total Submissions: 4236   Accepted: 1 ...

  3. SQL中的LEFT/RIGHT/SUBSTRING函数

    语法: LEFT(field,length) RIGHT(field,length)SUBSTRING(field,start,length) LEFT/RIGHT函数返回field最左边/最右边的l ...

  4. Android自定义View——实现字母导航栏

    1.自定义View实现字母导航栏 2.ListView实现联系人列表 3.字母导航栏滑动事件处理 4.字母导航栏与中间字母的联动 5.字母导航栏与ListView的联动 1.先看主布局,方便后面代码的 ...

  5. MyBatis:使用注解开发

    面向接口编程 大家之前都学过面向对象编程,也学习过接口,但在真正的开发中,很多时候我们会选择面向接口编程 根本原因 : 解耦 , 可拓展 , 提高复用 , 分层开发中 , 上层不用管具体的实现 , 大 ...

  6. Java 性能优化:面向对象及基础类型使用优化

    性能优化是个大筐,很多东西都能往里面装.虽说性能优化的具体方面比较多,但万丈高楼从地起,这里还是从Java最基本的一些入门知识相关的使用优化进行一些做些总结和建议.如何连最基本的API使用都不会,或不 ...

  7. jQuery实现轮播图--入门

    jQuery是一个前台的框架. 主要函数: setInterval 语法:setInterval(code,millisec[,"lang"]) cdoe:需要执行的代码或者要调用 ...

  8. dll hook 共享内存数据

    unit UnitDll; interface uses Windows; * ; // 文件映射到内存的大小 const HOOK_MEM_FILENAME = 'MEM_FILE'; // 映像文 ...

  9. docker入门2---docker的初体验

    Tomxin7 Simple, Interesting | 简单,有趣 第一个Docker镜像? 尝试运行docker自带的镜像"hello-world",了解docker镜像的下 ...

  10. SQL基础教程(第2版)第3章 聚合与排序:3-2 对表进行分组

    第3章 聚合与排序:3-2 对表进行分组 ● 使用GROUP BY子句可以像切蛋糕那样将表分割.通过使用聚合函数和GROUP BY子句,可以根据“商品种类”或者“登记日期”等将表分割后再进行汇总.● ...