jQuery选择器介绍:基本选择器、层次选择器、过滤选择器、表单选择器
来源:互联网 发布:域名停放 编辑:程序博客网 时间:2024/05/02 01:11
选择器是jQuery的根基,在jQuery中,对事件处理、遍历DOM和Ajax操作都依赖于选择器。因此,如果能熟练的使用选择器,不仅能简化代码,而且可以达到事半功倍的效果。jQuery选择器完全继承了CSS的风格。利用jQuery选择器,可以非常便捷的找出特定的DOM元素,然后为它们添加相应的行为,而无需担心浏览器是否支持这一选择器。
jQuery选择器可简单分为基本选择器、层次选择器、过滤选择器、表单选择器。下面通过表格进行一一介绍。
1.基本选择器
2.层次选择器
descendant(后代)元素集合元素$(“body div”)$(“parent>child”)匹配parent下的所有
child(子)元素集合元素$(“div>span”)$(“prev+next”)匹配紧接在prev后的
next元素集合元素$(“.error+span”)$(“prev~siblings”)匹配prev后的所有
siblings元素集合元素$(“span~a”)
3.过滤选择器
3.1 基本过滤选择器
索引从0开始集合元素$(“li:even”): odd匹配索引是奇数的元素
索引从0开始集合元素$(“li:odd”):eq(index)匹配索引等于index的元
素(索引从0开始)单个元素$(“input:eq(2)”):gt(index)匹配索引大于index的元
素(索引从0开始)集合元素$(“input:gt(1)”):lt(index)匹配索引小于index的元
素(索引从0开始)集合元素$(“input:lt(5)”):header匹配所有h1,h2…等
标题元素集合元素$(“:header”):animated匹配所有正在执行
动画的元素集合元素$(“div:animated”)
3.2 内容过滤选择器
的元素集合元素$(“p:contains(今天)”):empty匹配不含子元素或
文本元素的空元素集合元素$(“p:empty”):has(selector)匹配包含selector元素
的元素集合元素$(“div:has(span)”):parent匹配含有子元素或文本
的元素集合元素$(“div:parent”)
3.3 可见性过滤选择器
的元素集合元素$(“:hidden”):visible匹配所有可见元素集合元素$(“:visible”)
3.4 属性过滤选择器
的元素集合元素$(“img[alt]“)[attr=value]匹配属性值为value
的元素集合元素$(“a[title=test]“)[attr!=value]匹配属性值不等于
value的元素集合元素$(“a[title!=test]“)[attr^=value]匹配属性值以value
开头的元素集合元素$(“img[alt^=welcome]“)[attr$=value]匹配属性值以value
结尾的元素集合元素$(“img[alt$=last]“)[attr*=vlaue]匹配属性值中含有
value的元素集合元素$(“div[title*=test]“)[attr1][attr2]…通过多个属性
进行匹配集合元素$(“div[id][title*=test]“)
3.5 子元素过滤选择器
第index个子元素
索引从1开始集合元素$(“div:nth-child(2)”):first-child匹配每个父元素的
第一个子元素集合元素$(“div:first-child”):last-child匹配每个父元素的
最后一个子元素集合元素$(“div:last-child”): only-child某元素是它父元素中
的唯一的子元素
则匹配它集合元素$(“div:only-child”)
3.6 表单对象属性过滤选择器
的元素集合元素$(“form :disabled”):checked匹配所有被选中的元素
(含单选框,复选框)集合元素$(“input:checked”):selected匹配所有被选中的
选项元素集合元素$(“select :selected”)
4.表单选择器
select, button元素集合元素$(“input”):text匹配所有文本框集合元素$(“:text”):password匹配所有密码框集合元素$(“:password”):radio匹配所有单选框集合元素$(“:radio”):checkbox匹配所有所有多选框集合元素$(“:checkbox”):submit匹配所有提交按钮集合元素$(“:submit”):image匹配所有图像按钮集合元素$(“:image”):reset匹配所有重置按钮集合元素$(“:reset”):button匹配所有按钮集合元素$(“:button”):file匹配所有上传域集合元素$(“:file”)
0 0
- JQuery -- 介绍,选择器及其示例, 基本选择器,层次选择器,过滤选择器,表单选择器
- jQuery选择器介绍:基本选择器、层次选择器、过滤选择器、表单选择器
- jQuery选择器介绍:基本选择器、层次选择器、过滤选择器、表单选择器
- jQuery选择器 基本选择器 层次选择器 表单选择器 过滤选择器 练习 事例
- Jquery选择器分类(基本选择器,层次选择器,过滤选择器,表单选择器)
- jQuery选择器详细介绍:基本选择器,层次选择器,属性选择器
- Jquery基本选择器 层次选择器 过滤选择器 表单选择器使用示例 带注释
- jQuery基本选择器、层次选择器
- jquery层次过滤选择器
- 基本选择器,层次选择器
- 基本选择器、层次选择器
- jQuery选择器详解(层叠选择器/过滤选择器/表单选择器)
- jQuery选择器 层次选择器
- Jquery选择器--过滤选择器
- jQuery选择器 表单选择器
- jquery之层次选择器和过滤选择器
- jQuery表单过滤选择器
- jquery表单过滤选择器
- UVa 10048 Audiophobia
- c++初学者要点
- 机器学习:EM算法_续
- QEMU的模块化
- 基于Mysql Connector(C++)的数据库连接池的实现
- jQuery选择器介绍:基本选择器、层次选择器、过滤选择器、表单选择器
- Android中如何修改系统时间(应用程序获得系统权限)
- 如何安全的存储密码
- Execution failed for task ':xxx:packageAllDebugClassesForMul tiDex'. > java.util
- SQL必知必会(第3版)学习笔记【6-10章】
- csdn
- webpack入门(一)——webpack 介绍
- handoop安装(centos6.5+HDFS+YARN)
- Mac 系统下反编译apk