JQuery查找标签
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查找标签的更多相关文章
- jQuery查找标签--选择器,筛选器,模态对话框, 左侧菜单栏
查找标签 选择器: 基本选择器(同css) id选择器 $("#id") 标签选择器 $('tagName') class选择器 $(".className") ...
- DOM标签操作与事件与jQuery查找标签
目录 DOM之操作标签 创建标签对象 标签对象的属性 innerText与innerHTML 标签内部追加内容 属性操作 事件 常用事件 事件绑定 事件案例 jQuery简介 查找标签 基本选择器 属 ...
- jQuery 查找标签
1 基本选择器 2 基本筛选器 3 属性选择器 4 间接选择 1 基本选择器 //id选择器: $("#id") //标签选择器: $("tagName") / ...
- jquery查找父元素、子元素(个人经验总结)
使用js或者jquery查找父元素.子元素经常遇到.可是用起来总容易混淆,这里统一总结了一下,以后用起来相信会方便好多 这里jquery向上查找父元素 用到的方法:closest() parents( ...
- jQuery 查找元素1
jQuery 查找元素1 1. id // 通过id查找 $('#id') 2. class <div class='c1'></div> // 通过class查找 $('.c ...
- jQuery 查找元素2
jQuery 查找元素2 :first <ul> <li>list item 1</li> <li>list item 2</li> < ...
- jQuery 查找属性
jQuery 查找属性 示例: <div xsk='123' > <div xsk='456' > // 具有xsk属性的所有标签 $('[xsk]') // xsk属性等于1 ...
- JS BOM DOM对象 select联动 计时器 时间 css操作 节点(标签 ) 查找标签 {前端基础之BOM和DOM}
前端基础之BOM和DOM 前戏 到目前为止,我们已经学过了JavaScript的一些简单的语法.但是这些简单的语法,并没有和浏览器有任何交互. 也就是我们还不能制作一些我们经常看到的网页的一些交互,我 ...
- jQuery-选择器-查找标签
一.jQuery选择器 jQuery选择器就是帮助我们快速定位到一个或多个DOM节点 1.1 ID选择器 如果某个DOM节点有id属性,利用jQuery查找方式: <script src=&q ...
随机推荐
- Rancher第一款Kubernetes操作系统推出
Rancher实验室推出了业界首款针对Kubernetes的轻量级操作系统k3OS.它具有极低的资源消耗,最小的操作和二级引导,极大地简化了低资源计算环境. Kubernetes操作,提高Kubern ...
- 使用Redux管理React数据流要点浅析
在图中,使用Redux管理React数据流的过程如图所示,Store作为唯一的state树,管理所有组件的state.组件所有的行为通过Actions来触发,然后Action更新Store中的stat ...
- x++ 与 ++x的区别
相信在很多编程语言中都会遇见这个问题,这对于刚入编程的人来说可能是相当懵逼了. 老师的官方说法是:操作符在前面先进行自身运算,再进行其他运算:操作符在后面,先进行其他运算再进行自身运算. 反正我这段话 ...
- 九、CI框架之将URI转为数组原型
一.输入以下代码,uri_to_assoc的参数默认从3开始 二.输出效果如下: 不忘初心,如果您认为这篇文章有价值,认同作者的付出,可以微信二维码打赏任意金额给作者(微信号:382477247)哦, ...
- swift之保存数据到keychain
访问KeyChain 1.在mac上按下 Command+Space 输入Keychain Access 2.在终端输入security find-generic-password -help 读取配 ...
- OI常用模板
long long qpow(long long a,long long b,int mod) { ; while (b) { ) res=res*a%mod; a=a*a%mod; b>> ...
- Day 1:线程与进程系列问题(一)
一.进程与线程 进程:正在执行的程序称为一个线程,主要负责内存空间的划分. 线程:线程在一个进程中负责代码的执行,就是进程中的一个执行路径. 多线程:在一个进程中有多个线程同时在执行不同的任务(同时指 ...
- 《Thinking in Java》位运算
按位操作符: 首先先记住一件事,方便理解:是否对应正负对应10. 1.与(&):11得1,10得0,00得0. 2.或(|):11得1,10得1,00得0. 3.异或(^):11得0,10得1 ...
- IDEA--IDEA配置web项目
参考:https://blog.csdn.net/kfm1376822651/article/details/79666586 记学习springmvc时,使用idea部署web项目至tomcat. ...
- CSS行间样式与内部样式
注释 <!-- --> 快捷键 crtl+/ div 双标签<div></div> CSS语法 属性名:属性值: Css引入方式 1.行间样式的引入:在标签中 ...