JS_jq选择器合集

基本选择器

选择器返回示范描述
#id单个元素$("#test")
.class

集合元素

$(".test")
element集合元素$("p") 所有p原素
*集合元素$("*")所有原素
select1,select2,selectn集合元素$("div,span,p.myClass")所有匹配原素

层次选择器

选择器返回示范描述
$("ancestor descendant")集合元素$("div span")
$("parent>child")集合元素$("div>span") 所有子元素
$("prev+next")集合元素$(".one + div") 选取类名为one的下一个div同辈原素
可用next()方法代替$(".one").next("div")
$("prev~siblings")集合元素$(".two + div") 选取类名为two的所有div同辈原素 可用nextAll()方法代替
可用nextAll()方法代替$(".one").nextAll("div")

基本过滤选择器

选择器返回示范描述
:first单个元素$("div:first") 选取第一个元素
:last单个元素$("div:last") 选取最后一个元素
:not(selector)元素合集$("input:not(.myclass)") 选取类名不是myclass的原素
:even元素合集$("input:even") 选取索引是偶数的匹配元素
:odd元素合集$("input:odd") 选取索引是奇数的匹配元素
:eq(index)单个元素$("input:eq(1)") 选取索引是1的匹配元素
:gt(index)元素合集$("input:gt(1)") 选取索引大于1的匹配元素
:lt(index)元素合集$("input:lt(1)") 选取索引小于1的匹配元素
:header元素合集$(":header") 选取标题元素 如h1,h2等
:animated元素合集$("div:animated") 当前正在执行动画的所有元素
:focus元素合集$(":focus") 当前获取焦点的元素

内容过滤选择器

选择器返回示范描述
:contains(text)集合元素$("div:contains("我")") 选取含有文本“我”的div元素
:empty集合元素$("div:empty)") 选取不包含子元素(包括文本元素)的div元素
:has(selector)集合元素$("div:has(p))") 选取含有p元素的div元素
:parent集合元素$("div:parent)") 选取拥有子元素(包括文本元素)的div元素

可见性过滤选择器

选择器返回示范描述
:hidden集合元素

$(":hidden") 选取不可见元素包括<input type ="hidden"> <div style="display:none" > <div style="visibility:hidden "等>

:visible集合元素$(" div:visible)") 选取可见的div元素

属性过滤选择器

选择器返回示范描述
[attribute]集合元素$("div[id]") 选取拥有id属性等div元素
[attribute=value]集合元素$("div[title=test]") 选取拥有title属性为test的div元素
[attribute!=value]集合元素$("div[title=test]") 选取拥有没有title属性和title属性不为test的div元素
[attribute^=value]集合元素$("div[title^=test]") 选取属性和title属性以test为开始的div元素
[attribut$^=value]集合元素$("div[title^=test]") 选取属性和title属性以test为结束的div元素

还有其他多种不常用属性过滤选择器

注意1.3.1之前的版本属性选择器需要加@符号 注意代码报错的问题
之前("div[@title = 'test']");之后 ("div[title='test']");

子元素过滤选择器

选择器返回示范描述
:nth-child(index/even/odd/equation)集合元素:eq()只匹配一个元素 index值 从0开始 :nth-child()为每一个父元素匹配子元素 且index值从1开始
:first-child集合元素:first只返回单个元素 而:first-child将为每一个父元素匹配第一个字节
:last-child集合元素同上
:only-child集合元素$("ul li:only-child")在ul中选取是唯一子元素li 的li标签

:nth-child是常用选择器

  • :nth-child(even)选取偶数元素
  • :nth-child(odd)选取奇数元素
  • :nth-child(2)选取每个父元素下索引值为2的元素
  • :nth-child(3n)选取每个父元素下索引值是3的倍数的元素(n从1开始)
  • :nth-child(3n+1)选取每个父元素下索引值是3的倍数的元素(n从1开始)

表单对象属性过滤选择器

选择器返回示范描述
:enabled集合元素$("#form1:enabled")选取id为form1的表单内的所有可用元素
:disabled集合元素$("#form1:enabled")选取id为form1的表单内的所有不可用元素
:checked集合元素$("input:checked")选取所有被选中的元素(单选框 复选框)
:selected集合元素$("input:checked")选取所有被选中的元素(下拉列表)

表单选择器

选择器返回示范描述
:input集合元素$("input")选取所有<input><textarea><select><button>元素
:text集合元素$(":text")选取所有单行文本框
:password集合元素$(":password")选取所有密码框
:radio集合元素$(":radio")选取所有单选框
:checkbox集合元素$(":checkbox")选取所有复选框
:submit集合元素$(":submit")选取所有提交按钮
:image集合元素$(":image")选取所有图像按钮
:reset集合元素$(":reset")选取所有重置按钮
:button集合元素$(":button")选取所有按钮
:file集合元素$(":file")选取所有上传域
:hidden集合元素$(":hidden")选取所有不可见元素

.

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/10507.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

嵌入式C语言高级教程:实现基于STM32的智能健康监测手环

智能健康监测手环能够实时监控用户的生理参数&#xff0c;如心率、体温和活动量&#xff0c;对于健康管理和疾病预防非常有帮助。本教程将指导您如何在STM32微控制器上实现一个基本的智能健康监测手环。 一、开发环境准备 硬件要求 微控制器&#xff1a;STM32L476RG&#xf…

RS3236-3.3YUTDN4功能和参数介绍及PDF资料

RS3236-3.3YUTDN4功能和参数介绍及PDF资料-公司新闻-配芯易-深圳市亚泰盈科电子有限公司 品牌: RUNIC(润石) 封装: XDFN-4-EP(1x1) 描述: 带过温保护 输出类型: 固定 最大输入电压: 7.5V 输出电压: 3.3V 最大输出电流: 500mA RS3236-3.3YUTDN4 是一款低压差线性稳压器&#x…

kkfileview部署踩坑记录——kkfile部署启动失败、预览出错、乱码问题的处理

预览失败&#xff1a;报错 org.jodconverter.core.office.OfficeException: Could not store document: testdoc.pdf java.lang.NullPointerException: Could not open document: 1691539546735.docx 错误原因 由于kkfileView在linux上默认使用openOffice来实现转换 解决方…

leetcode 2316.统计无向图中无法互相到达点对数

思路&#xff1a;并查集 其实就是连通块的一个变形题目&#xff0c;一般的连通块题目要我们求的是连通个数&#xff0c;或者能不能到达&#xff0c;这里反过来问了。 首先&#xff0c;我们用dfs也是可以做到的&#xff0c;在dfs中统计每一个连通块的个数&#xff0c;然后用乘…

Spring原理分析--获取Environment资源对象

1.使用getEnvironment()获取环境信息 ApplicationContext接口继承了EnvironmentCapable接口&#xff0c;可以通过getEnvironment()获取Environment配置信息&#xff0c;例如&#xff1a; SpringBootApplication public class A01 {public static void main(String[] args) th…

解决方案:对数据进行负采样随机抽取1000W,用Pandas如何实现

文章目录 一、现象二、解决方案 一、现象 做建模的时候&#xff0c;有时候需要对数据进行负采样&#xff0c;就需要随机抽取数据&#xff0c;之前用SQL实现过order by rand()&#xff0c;附上链接解决方案&#xff1a;用户号出现多行&#xff0c;如何从中取其一并随机抽取100个…

PX4FMU和PX4IO最底层启动过程分析(下)

PX4FMU和PX4IO最底层启动过程分析&#xff08;下&#xff09; PX4FMU的系统启动函数为nash_main(int argc,char *argv[]) PX4IO的系统启动函数为nash_start(int argc,char *argv[]) PX4FMU启动函数nash_main(int argc,char *argv[]) 首先分析一下nash_main(int argc,char *a…

高效视频剪辑:视频批量调色,如何利用色调调整提升效率

在视频剪辑的后期处理中&#xff0c;调色是一个至关重要的环节。它不仅能够改变视频的整体氛围和风格&#xff0c;还能够突出视频的重点&#xff0c;增强观众的视觉体验。然而&#xff0c;对于大量的视频素材进行逐个调色处理&#xff0c;无疑会耗费大量的时间和精力。我们可以…

软件安装及YOLOv8环境配置及验证

先附上本章中所用到的软件及环境安装包&#xff0c;还有YOLOv8各任务权重&#xff1a; 软件及环境配置链接&#xff1a;https://pan.baidu.com/s/1-n2HJybicA6vW1YXfGRtcA 提取码&#xff1a;6vh8 YOLOv8各权重&#xff1a;链接&#xff1a;https://pan.baidu.com/s/1ApYUrJ_s…

C++相关概念和易错语法(12)(迭代器、string容量调整)

1.迭代器&#xff08;以string为例&#xff09; &#xff08;1&#xff09;基本理解&#xff1a;在我们刚接触迭代器的时候&#xff0c;我们可以将迭代器理解为改造过的“指针”&#xff0c;这是一个新的类型&#xff0c;指向对应容器中的各个元素。我们可以像指针那样对迭代器…

Lombok介绍、使用方法和安装

目录 1 Lombok背景介绍 2 Lombok使用方法 2.1 Data 2.2 Getter/Setter 2.3 NonNull 2.4 Cleanup 2.5 EqualsAndHashCode 2.6 ToString 2.7 NoArgsConstructor, RequiredArgsConstructor and AllArgsConstructor 3 Lombok工作原理分析 4. Lombok的优缺点 5. 总结 1 …

Idea入门:一分钟创建一个Java工程

一&#xff0c;新建一个Java工程 1&#xff0c;启动Idea后&#xff0c;选择 [New Project] 2&#xff0c;完善工程信息 填写工程名称&#xff0c;根据实际用途取有意义的英文名称选择Java语言&#xff0c;可以看到还支持Kotlin、Javascript等语言选择包管理和项目构建工具Mav…

Java中使用Comparable接口实现自然排序

Java中使用Comparable接口实现自然排序 在Java中&#xff0c;当我们需要对自定义对象进行排序时&#xff0c;Comparable接口就派上了大用场。Comparable接口定义了一个名为compareTo的方法&#xff0c;该方法用于比较两个对象。通过实现Comparable接口&#xff0c;我们可以定义…

力扣110:平衡二叉树

作者介绍&#xff1a;10年大厂数据\经营分析经验&#xff0c;现任大厂数据部门负责人。 会一些的技术&#xff1a;数据分析、算法、SQL、大数据相关、python 欢迎加入社区&#xff1a;码上找工作 作者专栏每日更新&#xff1a; LeetCode解锁1000题: 打怪升级之旅 python数据分析…

义乌玩具CPC认证公司

义乌玩具CPC认证公司概况 简介 义乌玩具CPC认证公司主要为儿童玩具产品提供符合美国消费品安全委员会&#xff08;CPSC&#xff09;制定的儿童产品证书&#xff08;Childrens Product Certificate, CPC&#xff09;的服务。CPC认证涉及的产品范围广泛&#xff0c;包括但不限于…

LVS的三种工作模式---(DR/TUN/NAT)

目录 一、NAT模式&#xff08;LVS-NAT&#xff09; 二、IP隧道模式&#xff08;LVS-TUN&#xff09; 三、DR模型--直接路由模式&#xff08;LVS-DR&#xff09; LVS/DR模式ARP抑制 原因&#xff1a; LVS的DR工作模式及配置&#xff1a; LVS的NAT工作模式及配置&#xff1…

PyQt6--Python桌面开发(7.QTextEdit多行富文本框控件)

QTextEdit多行富文本框控件 保存文件到本地QLine多行文本框.ui import sys import time from PyQt6.QtGui import QValidator,QIntValidator from PyQt6.QtWidgets import QApplication,QLabel,QLineEdit,QTextEdit from PyQt6 import uic,QtGuiif __name__ __main__:appQApp…

二叉树进阶 --- 上

目录 1. 二叉搜索树的概念及结构 1.1. 二叉搜索树的概念 1.2. 二叉搜索树的结构样例 2. 二叉搜索树的实现 2.1. insert 的非递归实现 2.2. find 的非递归实现 2.3. erase 的非递归实现 2.3.1. 第一种情况&#xff1a;所删除的节点的左孩子为空 2.3.1.1. 错误的代码 2…

基本QinQ

拓扑图 配置 开启LLDP功能&#xff0c;查看是否能通过QinQ隧道透传 sysname AR1 # lldp enable # interface GigabitEthernet0/0/0.10dot1q termination vid 10ip address 12.1.1.1 255.255.255.0 arp broadcast enable # sysname AR2 # lldp enable # interface GigabitE…

天童教育:孩子是难以改变的,除非他感觉到爱

在家长眼里&#xff0c;明明对孩子上了很多心&#xff0c;但是孩子就是很顽固&#xff0c;软硬皆施都收效甚微&#xff0c;家长们束手无策。都说孩子是最容易接受知识的熏陶的年纪&#xff0c;为什么看起来这样难以改变呢&#xff1f; 孩子有问题&#xff0c;往往因为内在的渴…