jQuery--选择器总结
传统选择器:
$('#test') id选择器
$('.test') class选择器
$('p') 标签选择器
$('*') 通配符选择器
$('div,span,.myclass') 多个元素选择器
层次选择器:
$('div span') 选取div 里所有的span 元素
$('div>span') 选取div元素下的子span
$('div+span') 选择div后紧接着的span元素
$('div~span') 选择div 后面所有的span兄弟元素
过滤选择器:
$('div:first') 第一个div元素
$('div:last') 最后一个div元素
$('input:not(.myclass)') 选取class 不是myclass 的input元素
$('input:even') 选取索引为偶数的input元素
$('input:odd') 选取索引为奇数的input元素
$('input:eq(1)') 选取索引为1的input元素
$('input:gt(1)') 选取索引大于1的input元素
$('input:lt(1)') 选取索引小于1的input元素
$(':header') 选取网页中所有的标题元素
$('div:animated') 选取正在执行动画的div元素
内容过滤选择器:
$('div:contains("test")') 选择所有含有文字 test 的div元素
$('div:empty') 选择不包含子元素的 div空元素
$('div:has(p)') 选择含有 p标签的div元素
$('div:parent')选择含有子元素的div元素
可见性过滤选择器:
$('input:hidden') 选择所有隐藏的input
$('div:visible') 选择所有可见的div元素
属性过滤器:
$('div[id]') 选择拥有属性id 的选择器
$('div[id=test]') 选择属性id 为test 的div选择器
$('div[id!=test]') 选择属性id 不为test 的div选择器
$('div[id^=test]') 选择属性id 值以test开头 的div选择器
$('div[id$=test]') 选择属性id 值以test结尾 的div选择器
$('div[id*=test]') 选择属性id 值包含test 的div选择器
$('div[id][title$="test"]') 选择有属性id 并且title属性以test 结尾的div
子元素过滤选择器:
$('div:nth-child(1)') 选取每个父元素第index 的元素
$('ul li:first-child') 选取每个ul 中第一个li元素
$('ul li:last-child') 选取每个ul 中最后一个li元素
$(ul li:only-child) 选取是唯一子元素的li元素
$(div:nth-child(even)) 选择偶数的div元素
$(div:nth-child(odd)) 选择基数的div元素
$(div:nth-child(3n)) 选择3的倍数的div元素
表单对象属性过滤器:
$('#form1 :enabled') 选取id为form1 的表单内所有可用元素(注意:这里是有空格的)
$('#form1 :disabled') 选取id为form1 的表单内所有不可用元素(注意:这里是有空格的)
$('input:checked') 选取所有被选中的input 元素
$('select :selected') 选取所有被选中的下拉列表
jQuery--选择器总结的更多相关文章
- JQuery 选择器
选择器是JQuery的根基,在JQuery中,对事件的处理,遍历DOM和AJAX操作都依赖于选择器.如果能够熟练地使用选择器,不仅能简化代码,而且还可以事半功倍. JQuery选择器的优势 1.简洁的 ...
- jQuery的案例及必知重要的jQuery选择器
Jquery能做什么 访问和操作DOM元素 控制页面样式 对页面事件进行处理 扩展新的jQuery插件 与Ajax技术完美结合 Jquery的优势 体积小,压缩后只有100KB左右 l强大的选择器 出 ...
- 深入学习jQuery选择器系列第一篇——基础选择器和层级选择器
× 目录 [1]id选择器 [2]元素选择器 [3]类选择器[4]通配选择器[5]群组选择器[6]后代选择器[7]兄弟选择器 前面的话 选择器是jQuery的根基,在jQuery中,对事件处理.遍历D ...
- jQuery选择器和选取方法 http://www.cnblogs.com/MaxIE/p/4078869.html
我们已经使用了带有简单Css选择器的jQuery选取函数:$().现在是时候深入了解jQuery选择器语法,以及一些提取和扩充选中元素集的方法了. 一.jQuery选择器 在CSS3选择器标淮草案定义 ...
- 《锋利的jQuery(第2版)》笔记-第2章-jQuery选择器
选择器是jQuery的根基,在jQuery中,对事件处理.遍历DOM和Ajax操作都依赖于选择器.熟练使用选择器,不仅可以简化代码,而且可以达到事半功倍的效果. 2.1 jQuery选择器是什么 1. ...
- 深入学习jQuery选择器系列第八篇——过滤选择器之伪子元素选择器
× 目录 [1]通用形式 [2]反向形式 [3]首尾元素 [4]唯一元素 前面的话 本文是子元素选择器的续篇,主要介绍关于nth-of-type()选择器的内容.该部分内容并非没有出现在<锋利的 ...
- 深入学习jQuery选择器系列第四篇——过滤选择器之属性选择器
× 目录 [1]简单属性 [2]具体属性 [3]条件属性 前面的话 属性过滤选择器的过滤规则是通过元素的属性来获取相应的元素,对应于CSS中的属性选择器.属性过滤选择器可分为简单属性选择器.具体属性选 ...
- 深入学习jQuery选择器系列第二篇——过滤选择器之子元素选择器
× 目录 [1]通用形式 [2]反向形式 [3]首尾元素 [4]唯一元素 前面的话 在上一篇中已经介绍过基础选择器和层级选择器,本文开始介绍过滤选择器.过滤选择器是jQuery选择器中最为庞大也是最为 ...
- jQuery-1.9.1源码分析系列(二)jQuery选择器
1.选择器结构 jQuery的选择器根据源码可以分为几块 init: function( selector, context, rootjQuery ) { ... // HANDLE: $(&quo ...
- jQuery-1.9.1源码分析系列(二)jQuery选择器续1
在分析之前说一点题外话. ownerDocument和 documentElement的区别 ownerDocument是Node对象的一个属性,返回的是某个元素的根节点文档对象:即document对 ...
随机推荐
- linux应用程序开发-进程通信(IPC)
IPC why: 1.数据传输 2.资源共享 目的: 3.通知事件 4.进程控制 发展: 1.UNIX进程间通信 2.基于SYStem V 3.POSIX 方式分类: 1.pipe(管道) FIFO( ...
- jQuery Length属性
Length属性 属性用于返回当前jQuery对象的元素个数. 语法 jQueryObject.length 返回值 Number类型 返回该jQuery对象封装的DOM元素的个数. 实例说明 代码 ...
- Spring jar包详解
Spring jar包详解 org.springframework.aop ——Spring的面向切面编程,提供AOP(面向切面编程)的实现 org.springframework.asm——spri ...
- python画柱状图
#coding:utf-8 __author__ = 'similarface' from collections import defaultdict PMRAdata=defaultdict(li ...
- myeclipse下构建maven web项目
首先创建一个Maven的Project如下图 我们勾选上Create a simple project (不使用骨架) 这里的Packing 选择 war的形式 由于packing是war包,那么下面 ...
- js函数前面写上分号的原因
说个之前先说,网站上传一些文件,考虑到性能问题,会用一些压缩软件来压缩代码(grunt,glup,webpack,etc..),这时候就可能出现一个问题.看下面代码 (function a(){... ...
- DOM hash
前段时间做的一个H5专题,用到了hash解决问题,特意记录一下.DOM hash的详细内容可以点击链接查看. hash就是uri中#及后面的部分,例如:www.google.com.hk#123的#1 ...
- [sqoop1.99.7] sqoop实例——数据ETL
一.创建一个mysql的link MySQL链接使用的是JDBC,必须有对应的驱动文件jar,还得有对应的访问权限,请确保能在server端访问MySQL.确保mysql的jar包已经导入到${SQO ...
- .net 项目 调用webservice 出错,异常信息:对操作“xxx”的回复消息正文进行反序列化时出错。解决方案。
项目运行好好的,增加并更新WebService后,出错,捕获异常信息为:对操作“xxx”的回复消息正文进行反序列化时出错.解决方案. 认真分析异常信息后,得到关键提醒: {"读取 XML 数 ...
- 定位 position: absolute & relative
[position:absolute] 意思是绝对定位,他默认参照浏览器的左上角,配合TOP.RIGHT.BOTTOM.LEFT(下面简称TRBL)进行定位,有以下属性: 1)如果没有TRBL,以父级 ...