jQuery选择器
来源:互联网 发布:钢管租赁软件下载 编辑:程序博客网 时间:2024/06/11 20:44
选择器是jQuery的根基,熟练使用选择器能达到事半功倍的效果
选择器的种类:
1. 基本选择器
$("#id") // 按ID选取元素
$(".mini") // 按class选取元素
$("div") // 按tag name选取元素
$("*") // 选取所有元素
$("#id,.mini") // 混合选取,返回所有符合条件的元素
2. 层次选择器
$("div span") // div 下所有的 span
$("div>span") // div下一层所有span但是测试并没有发现不同
$("div+span") // div 后紧接着的下一个span
== $("div").next("div");
$("div~span") // div 后所有的span
== $("div").nextAll("div");
3. 过滤选择器
基本过滤选择器
$("div:first") // 第一个div
$("div:last") // 最后一个div
$("input:not(.myClass)") //所有类不是myclass的input
$("table tbody tr:even") // 偶数行
$("table tbody tr:odd") // 奇数行
$("tr:eq(2)") // 选取第二行
$("tr:gt(3)") // 第3个之后的所有
$("tr:lt(3)") // 第3个之前的所有
$(":header") // 所有header <h1> <h2> <h3> ...
$("div:animated") //正在执行动画的div
内容过滤选择器
$("div:contains('text')") //div 下所有包含文本text的元素
$(div:empty) // 空div,没有文本,没有子元素
$(div:has(p)) // 选取含有 <p>元素的div
$(div:parent) // 选取拥有子元素的div元素(包括文本)
可见性过滤选择器
$("div:hidden") // 所有不可见的div
$("div:visible") // 所有可见的div
属性过滤选择器
$("div[id]") // 拥有id的元素
$("div[title=test]") // 属性title为test的元素
$("div[title!=test]")// 不等于test
$("div[title^=test]")// 以test开头
$("div[title$=test]")// 以test结束
$("div[title*=test]")// 包含test
$("div[id][title!=test]")// 多个元素同时选择
子元素过滤选择器
:nth-child(even/odd/index/equation)
:first-child
:last-child
:only-child
表单对象过滤选择器
$("#form1:enabled") // id为form1下所有可用元素
$("#form2:disabled")// id为form2下所有不可用元素
$("input:checked")//所有选中的<input>元素
$("select:selected")//所有被选中的select元素
4. 表单选择器
$(":input") // 选取所有的<input>,<textarea>,<select>,<button> 元素
$(":text") // 所有的单行输入文本框
$(":password") // 所有的密码框
$(":radio") // 所有的单选框
$(":checkbox") // 所有的多选框
$(":submit") // 所有的提交按钮
$(":image") // 所有的图片元素
$(":reset") // 所有的重置按钮
$(":button") // 所有的按钮
$(":file") // 所有的文件域
$(":hidden") // 所有不可见元素
手机放在无线键鼠前面会导致键鼠偶尔失灵
选择器的种类:
1. 基本选择器
$("#id") // 按ID选取元素
$(".mini") // 按class选取元素
$("div") // 按tag name选取元素
$("*") // 选取所有元素
$("#id,.mini") // 混合选取,返回所有符合条件的元素
2. 层次选择器
$("div span") // div 下所有的 span
$("div>span") // div下一层所有span但是测试并没有发现不同
$("div+span") // div 后紧接着的下一个span
== $("div").next("div");
$("div~span") // div 后所有的span
== $("div").nextAll("div");
3. 过滤选择器
基本过滤选择器
$("div:first") // 第一个div
$("div:last") // 最后一个div
$("input:not(.myClass)") //所有类不是myclass的input
$("table tbody tr:even") // 偶数行
$("table tbody tr:odd") // 奇数行
$("tr:eq(2)") // 选取第二行
$("tr:gt(3)") // 第3个之后的所有
$("tr:lt(3)") // 第3个之前的所有
$(":header") // 所有header <h1> <h2> <h3> ...
$("div:animated") //正在执行动画的div
内容过滤选择器
$("div:contains('text')") //div 下所有包含文本text的元素
$(div:empty) // 空div,没有文本,没有子元素
$(div:has(p)) // 选取含有 <p>元素的div
$(div:parent) // 选取拥有子元素的div元素(包括文本)
可见性过滤选择器
$("div:hidden") // 所有不可见的div
$("div:visible") // 所有可见的div
属性过滤选择器
$("div[id]") // 拥有id的元素
$("div[title=test]") // 属性title为test的元素
$("div[title!=test]")// 不等于test
$("div[title^=test]")// 以test开头
$("div[title$=test]")// 以test结束
$("div[title*=test]")// 包含test
$("div[id][title!=test]")// 多个元素同时选择
子元素过滤选择器
:nth-child(even/odd/index/equation)
:first-child
:last-child
:only-child
表单对象过滤选择器
$("#form1:enabled") // id为form1下所有可用元素
$("#form2:disabled")// id为form2下所有不可用元素
$("input:checked")//所有选中的<input>元素
$("select:selected")//所有被选中的select元素
4. 表单选择器
$(":input") // 选取所有的<input>,<textarea>,<select>,<button> 元素
$(":text") // 所有的单行输入文本框
$(":password") // 所有的密码框
$(":radio") // 所有的单选框
$(":checkbox") // 所有的多选框
$(":submit") // 所有的提交按钮
$(":image") // 所有的图片元素
$(":reset") // 所有的重置按钮
$(":button") // 所有的按钮
$(":file") // 所有的文件域
$(":hidden") // 所有不可见元素
手机放在无线键鼠前面会导致键鼠偶尔失灵
阅读全文
0 0
- CSS选择器,jQuery选择器
- jQuery选择器 CSS选择器
- JQuery选择器(选择器简介)
- jQuery选择器 基本选择器
- jQuery选择器 层次选择器
- jQuery选择器 表单选择器
- Jquery选择器-基本选择器
- jQuery选择器之类选择器
- jQuery选择器之类选择器
- jQuery选择器之类选择器
- Jquery选择器--过滤选择器
- JQuery选择器
- jquery 选择器
- Jquery选择器
- jQuery选择器
- jQuery 选择器
- JQuery选择器
- JQuery选择器
- 深入浅出MySQL笔记(一)
- java线程关于售票问题
- 今天遇到的关于重定向地址栏乱码的问题
- P1019 单词接龙【DFS+字符串】
- java中的二分查找
- jQuery选择器
- 选择屏幕中 如何自定义 功能按钮
- [AGC001E]BBQ Hard-组合数学
- ubuntu 常用命令
- OkHttp wiki官方文档翻译(一)
- Spring AOP(2)
- BZOJ 4636 蒟蒻的数列
- Java中方法的重载和重写的区别
- Spring AOP(3)