1.基本选择器

 $("#id")            //ID选择器
$("div") //元素选择器
$(".classname") //类选择器
$(".classname,.classname1,#id1") //组合选择器

2.层次选择器

$("#id>.classname ")    //子元素选择器
$("#id .classname ") //后代元素选择器
$("#id + .classname ") //紧邻下一个元素选择器
$("#id ~ .classname ") //兄弟元素选择器

3.过滤选择器

3.1条件过滤器

$("li:first")    //第一个li
$("li:last") //最后一个li
$("li:even") //挑选下标为偶数的li
$("li:odd") //挑选下标为奇数的li
$("li:eq(4)") //下标等于 4 的li(第五个 li 元素)
$("li:gt(2)") //下标大于 2 的li
$("li:lt(2)") //下标小于 2 的li
$("li:not(#runoob)") //挑选除 id="runoob" 以外的所有li

3.2内容过滤选择器

$("div:contains('Runob')")    // 包含 Runob文本的元素
$("td:empty") //不包含子元素或者文本的空元素
$("div:has(selector)") //含有选择器所匹配的元素
$("td:parent") //含有子元素或者文本的元素

3.3可见性过滤选择器

$("li:hidden")       //匹配所有不可见元素,或type为hidden的元素
$("li:visible") //匹配所有可见元素

3.4属性过滤选择器

$("div[id]")        //所有含有 id 属性的 div 元素
$("div[id='123']") // id属性值为123的div 元素
$("div[id!='123']") // id属性值不等于123的div 元素
$("div[id^='qq']") // id属性值以qq开头的div 元素
$("div[id$='zz']") // id属性值以zz结尾的div 元素
$("div[id*='bb']") // id属性值包含bb的div 元素
$("input[id][name$='man']") //多属性选过滤,同时满足两个属性的条件的元素

3.5状态过滤选择器

$("input:enabled")    // 匹配可用的 input
$("input:disabled") // 匹配不可用的 input
$("input:checked") // 匹配选中的 input
$("option:selected") // 匹配选中的 option

4.表单选择器

$(":input")      //匹配所有 input, textarea, select 和 button 元素
$(":text") //所有的单行文本框,$(":text") 等价于$("[type=text]"),推荐使用$("input:text")效率更高,下同
$(":password") //所有密码框
$(":radio") //所有单选按钮
$(":checkbox") //所有复选框
$(":submit") //所有提交按钮
$(":reset") //所有重置按钮
$(":button") //所有button按钮
$(":file") //所有文件域

*注:本文引用于菜鸟教程 Jquery选择器笔记部分

Jquery选择器小结的更多相关文章

  1. 《锋利的jQuery(第2版)》笔记-第2章-jQuery选择器

    选择器是jQuery的根基,在jQuery中,对事件处理.遍历DOM和Ajax操作都依赖于选择器.熟练使用选择器,不仅可以简化代码,而且可以达到事半功倍的效果. 2.1 jQuery选择器是什么 1. ...

  2. jQuery学习笔记(一)jQuery选择器

    目录 jQuery选择器的优点 基本选择器 层次选择器 过滤选择器 表单选择器 第一次写博客,希望自己能够长期坚持,以写博客的方式作为总结与复习. 最近一段时间开始学习jQuery,通过写一个jQue ...

  3. Jquery选择器 讲解

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

  4. jQuery选择器部分知识点总结

    一.jQuery选择器的优势 1.使用CSS选择器时,开发人员需要考虑主流浏览器是否支持某些选择器,而在jQuery中,开发人员则可以放心的使用jQuery选择器而无需考虑浏览器是否支持这些选择器. ...

  5. 《jQuery权威指南》学习笔记之第2章 jQuery选择器

    2.1 jQuery选择器概述 2.1.1 什么使选择器 2.1.2 选择器的优势: 代码更简单,完善的检测机制  1.代码更简单   示例2-1     使用javascript实现隔行变色 < ...

  6. jQuery选择器的分类

    jQuery选择器的分类 jQuery中有很多分类,大类分为四类,四类里面又分为很多小类,下面就为大家一一介绍,这些选择器的使用和好处,Me用的是jQuery1.8.3的版本 选择器都有哪四类?? 1 ...

  7. jQuery选择器(转)

    原文:http://www.cnblogs.com/qinwang913/p/3444135.html 一.基本分类 jQuery选择器大致可以分为两类,基本选择器和过滤选择器,总体结构体系如下:   ...

  8. jQuery笔记(一)jQuery选择器

    一.前言 编写任何javascript程序我们要首先获得对象, jQuery选择器能彻底改变我们平时获取对象的方式, 可以获取几乎任何语意的对象, 比如"拥有title属性并且值中包含tes ...

  9. JQuery:JQuery基本语法,JQuery选择器,JQuery DOM,综合案例 复选框,综合案例 随机图片

    知识点梳理 课堂讲义 1.JQuery快速入门 1.1.JQuery介绍 jQuery 是一个 JavaScript 库. 框架:Mybatis (jar包) 大工具 插件:PageHelper (j ...

随机推荐

  1. Python中logging在多进程环境下打印日志

    因为涉及到进程间互斥与通信问题,因此默认情况下Python中的logging无法在多进程环境下打印日志.但是查询了官方文档可以发现,推荐了一种利用logging.SocketHandler的方案来实现 ...

  2. coverage代码覆盖率的使用~~

    我们看下代码覆盖率的统计~,这个不必太揪心,觉得可以帮助你优化代码,可以看看,也不要带在意~ 1.先在cmd命令窗口在线安装coverage pip install coverage 2.安装完毕后我 ...

  3. 表单绑定 v-model

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  4. 浅谈UML的概念和模型

    讲了UML的基本的九种图:http://blog.csdn.net/jiuqiyuliang/article/details/8552956 来具体讲讲这九种视图: 1.用例图(use case di ...

  5. python笔记007-函数

    昨日简要: 1.文件操作: 1.1获得句柄: f = open(‘one.txt’,mode=’’,encoding=’utf-8’) f = open(‘../’) à返回上一层 f = open( ...

  6. docker&k8s-配置/常用命令

      kubectl delete deployment,ingress,svc demo-mml-jp-ylmopt-web-1 -n demo-mml  #删除预生产环境mml组ylmopt-web ...

  7. Django——关于项目开发遇到的一些小技巧

    目录 头像图片 js获取网站信息 js获取前端信息 Dj获取刚写入的数据的信息 js跳转新链接 头像图片对象的显示 在做到根据登陆ID决定用户头像的时候,加载静态文件的{% static ‘xxxxx ...

  8. 15_IO流

    IO流 流 流的概念 流(stream)是指一连串流动字节/字符,按照先进先出的方式发送的信息的通道中. 数据源:流入通道中的数据的来源 目的地:流出通道的数据的目的地   输入流和输出流 数据源的数 ...

  9. win7+cuda+anaconda python+tensorflow-gpu+keras安装成功版本匹配汇总

    win7+cuda+anaconda python+tensorflow-gpu+keras安装成功版本匹配汇总 2019-09-20 15:06:03 wyx100 阅读数 38更多 分类专栏: M ...

  10. C# xml序列化 datatime字段

    [XmlIgnore] public DateTime ApplicationDatetime { get; set; } [XmlElement("ApplicationDatetime& ...