下面列举了61种jQuery 选择器 参考

选择器 语句 描述
* $("*") 选择所有元素
#id $("#lastname") id=“lastname”的元素
.class $(".intro") class=“intro”的所有元素
.class,.class $(".intro,.demo") 所有带有“intro”或“demo”类的元素
element $("p") 所有<p>元素
el1,el2,el3 $("h1,div,p") 所有<h1>,<div>和<p>元素
:first $("p:first") 第一个<p>元素
:last $("p:last") 最后一个<p>元素
:even $("tr:even") 所有偶数<tr>元素
:odd $("tr:odd") 所有奇数<tr>元素
:first-child $("p:first-child") 所有<p>元素都是其父元素的第一个子元素
:first-of-type $("p:first-of-type") 所有<p>元素是其父元素的第一个<p>元素
:last-child $("p:last-child") 所有<p>元素是其父级的最后一个子元素
:last-of-type $("p:last-of-type") 所有<p>元素是其父级的最后一个<p>元素
:nth-child(n) $("p:nth-child(2)") 所有<p>元素是其父级的第二个子元素
:nth-last-child(n) $("p:nth-last-child(2)") 所有<p>元素,它们是父元素的第二个子元素,从最后一个子元素开始计算
:nth-of-type(n) $("p:nth-of-type(2)") 所有<p>元素是其父元素的第二个<p>元素
:nth-last-of-type(n) $("p:nth-last-of-type(2)") 所有<p>元素是其父元素的第二个<p>元素,从最后一个子元素开始计算
:only-child $("p:only-child") 所有<p>元素是其父元素的唯一子元素
:only-of-type $("p:only-of-type") 所有<p>元素,它们是父类的唯一子类型
parent>child $("div > p") 所有<p>元素是<div>元素的直接子元素
parent descendant $("div p") 所有<p>元素都是<div>元素的后代
element + next $("div + p") 每个<div>元素旁边的<p>元素
element ~ siblings $("div ~ p") 所有<p>元素都是<div>元素的兄弟元素
:eq(index) $("ul li:eq(3)") 列表中的第四个元素(索引从0开始)
:gt(no) $("ul li:gt(3)") 列出索引大于3的元素
:lt(no) $("ul li:lt(3)") 列出索引小于3的元素
:not(selector) $("input:not(:empty)") 所有非空的输入元素
:header $(":header") 所有标题元素<h1>,<h2> ...
:animated $(":animated") 所有动画元素
:focus $(":focus") 当前具有焦点的元素
:contains(text) $(":contains('Hello')") 包含文本“Hello”的所有元素
:has(selector) $("div:has(p)") 具有<p>元素的所有<div>元素
:empty $(":empty") 所有空元素
:parent $(":parent") 所有元素都是另一个元素的父元素
:hidden $("p:hidden") 所有隐藏的<p>元素
:visible $("table:visible") 所有可见的表格
:root $(":root") 文档的根元素
:lang(language) $("p:lang(de)") 具有以“de”开头的lang属性值的所有<p>元素
[attribute] $("[href]") 具有href属性的所有元素
[attribute=value] $("[href='default.htm']") href属性值等于“default.htm”的所有元素
[attribute!=value] $("[href!='default.htm']") href属性值不等于“default.htm”的所有元素
[attribute$=value] $("[href$='.jpg']") href属性值以“.jpg”结尾的所有元素
[attribute|=value] $("[title|='Tomorrow']") title属性值等于'Tomorrow'的所有元素,或者以'Tomorrow'开头,后跟连字符
[attribute^=value] $("[title^='Tom']") 标题属性值以“Tom”开头的所有元素
[attribute~=value] $("[title~='hello']") 具有title属性值的所有元素包含特定单词“hello”
[attribute*=value] $("[title*='hello']") 标题属性值包含单词“hello”的所有元素
:input $(":input") 所有输入元素
:text $(":text") type =“text”的所有输入元素
:password $(":password") 所有输入元素的类型=“密码”
:radio $(":radio") type=“radio”的所有输入元素
:checkbox $(":checkbox") type=“checkbox”的所有输入元素
:submit $(":submit") type=“submit”的所有输入元素
:reset $(":reset") type=“reset”的所有输入元素
:button $(":button") 所有输入元素的type=“button”
:image $(":image") type=“image”的所有输入元素
:file $(":file") type=“file”的所有输入元素
:enabled $(":enabled") 所有启用的输入元素
:disabled $(":disabled") 所有禁用的输入元素
:selected $(":selected") 所有选定的输入元素
:checked $(":checked") 所有选中的输入元素

jQuery 选择器有61种你都知道了多少的更多相关文章

  1. 汇总jQuery的61种选择器及示例

    汇总jQuery的61种选择器及示例 恋痿喃 ㄍń稀广 因罘乐睽 ú燔蒇 骤幄觳 ч豹 齑骝氮铷 宅廓Ω孓 锏遒 荛猩ㄜ彬 芡钷ж ┊贩错鹌 掩饰着可还是几步就窜到了门口看着这个让她 ...

  2. jQuery的61种选择器

    The Write Less , Do More ! jQuery选择器 1. #id : 根据给定的ID匹配一个元素 <p id="myId">这是第一个p标签< ...

  3. jquery接触初级----- 一种新奇的选择器用法

    今天看到一个新奇的jquery 选择器的用法,因为以前没有见过,所以记录下来 1.jquery 选择器: 给body添加一个元素,添加元素的时候,同时把属性和点击事件都一起进行添加 <!DOCT ...

  4. 你都掌握了吗?jQuery 选择器大全

    在 Dom 编程中我们只能使用有限的函数根据 id 或者 TagName 获取 Dom 对象. 然而在 jQuery 中则完全不同,jQuery 提供了异常强大的选择器用来帮助我们获取页面上的对象, ...

  5. 10种jquery选择器操作详解(转)

    jquery选择器大体上可分为4 类: 1.基本选择器2.层次选择器3.过滤选择器4.表单选择器 其中过滤选择器可以分为:1.简单过滤选择器2.内容过滤选择器3.可见性过滤选择器4.属性过滤选择器5. ...

  6. jQuery 选择器 筛选器 样式操作 文本操作 属性操作 文档处理 事件 动画效果 插件 each、data、Ajax

    jQuery jQuery介绍 1.jQuery是一个轻量级的.兼容多浏览器的JavaScript库. 2.jQuery使用户能够更方便地处理HTML Document.Events.实现动画效果.方 ...

  7. jQuery的案例及必知重要的jQuery选择器

    Jquery能做什么 访问和操作DOM元素 控制页面样式 对页面事件进行处理 扩展新的jQuery插件 与Ajax技术完美结合 Jquery的优势 体积小,压缩后只有100KB左右 l强大的选择器 出 ...

  8. 深入学习jQuery选择器系列第一篇——基础选择器和层级选择器

    × 目录 [1]id选择器 [2]元素选择器 [3]类选择器[4]通配选择器[5]群组选择器[6]后代选择器[7]兄弟选择器 前面的话 选择器是jQuery的根基,在jQuery中,对事件处理.遍历D ...

  9. jQuery选择器和选取方法 http://www.cnblogs.com/MaxIE/p/4078869.html

    我们已经使用了带有简单Css选择器的jQuery选取函数:$().现在是时候深入了解jQuery选择器语法,以及一些提取和扩充选中元素集的方法了. 一.jQuery选择器 在CSS3选择器标淮草案定义 ...

随机推荐

  1. 多个浏览器下应用前端JS实现一键导出excel表

    自己试验了几种方法,找到一种较为全面的一种方式一键输出Excel表格,代码如下 <!DOCTYPE html> <html> <head lang="en&qu ...

  2. 设置view的layer属性方法

    1.需要导入QuartzCore.framewoork框架到工程2.在文件中导入#import 3.设置 必须导入的空间 #import<QuartzCore/QuartzCore.h> ...

  3. ucoreOS_lab8 实验报告

    所有的实验报告将会在 Github 同步更新,更多内容请移步至Github:https://github.com/AngelKitty/review_the_national_post-graduat ...

  4. Android,百度,云知声tts总结

    最近在做Android语音播报功能(TTS),现总结如下:(ps:demo代码地址:https://github.com/giserlong/TTS_DEMO) 一.Android原生接口 用Andr ...

  5. emacs require和provide

    Emacs的默认配置文件是.emacs,Emacs启动时会读取并执行.emacs中的LISP代码,用户使用.emacs达到自己的Emacs初始化配置目的. 不过单独使用.emacs有一个问题,因为时间 ...

  6. 最新内核3.4)Linux 设备树加载I2C client adapter 的流程(内核3.4 高通)【转】

    转自:https://blog.csdn.net/lsn946803746/article/details/52515225 版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转 ...

  7. spark Streaming与kafka的集成消费

    Spark 2.3.3    Kafka   2.11-1.0.2        Java  jdk1.8.0_191           Hbase 1.2.11 from pyspark impo ...

  8. php 学习笔记之搭建开发环境(mac版)

    Mac 系统默认集成了很多开发工具,其中就包括 php 所需要的一些软件工具. 下面我们将搭建最简单的 php 开发环境,每一步都会验证上一步的操作结构,请一步一步跟我一起搭建吧! web 服务器之 ...

  9. 图像检索——VLAD

    今天主要回顾一下关于图像检索中VLAD(Vector of Aggragate Locally Descriptor)算法,免得时间一长都忘记了.关于源码有时间就整理整理. 一.简介 虽然现在深度学习 ...

  10. 基于web公交查询系统----管理员公交站点管理页面实现

    主要用到内容:vue,coreui bootstrap框架,Ajax,springmvc搭建的接口,css之类的都是顺手拈来的简单的界面设计 网页代码: <!DOCTYPE html> & ...