jquery的选择器
一。基本选择器
1.$("#id") id选择器,返回单个元素
2.$(".class") class选择器,返回集合元素
3.$("element") 标签element,返回集合元素
4.$("*") 所有元素*,改变所有html标签元素,返回集合元素
5.$("selector,selector2……") 将每一个选择器匹配到的元素合并后一起返回,返回集合元素
二。层次选择器
1.$("ancestor descendant") 后代元素选择器,其中ancestor是指任何有效元素,descendant是其后代
2.$("parent>child") 子元素选择器
注:子元素选择器只能选择到子元素,后代元素选择器能选择所有后代,子孙等
3.$("prev+next") 相邻元素选择器,next是prev元素相邻的下一个元素
4.$("prev~siblings") 兄弟选择器,siblings是指prev元素后面的所有兄弟元素
在这里写几个方法,可以与上面的方法交替使用:
1.jquery.parent() 找父元素
2.jquery.parents() 找到所有祖先元素,不只限于一个父元素
3.jquery.children() 查找所有子元素,只会找到直接的孩子节点,不会孙子
4.jquery.contents() 查找下面的所有内容,包括节点和文本
5.jquery.prev() 查找上一个兄弟节点
6.jquery.prevAll() 查找之前的所有兄弟节点
7.jquery.next() 查找下一个兄弟节点
8.jquery.nextAll() 查找之后的所有兄弟节点
9.jquery.siblings() 查找其余的所有兄弟节点,部分前后
10.jquery.find(expr) 查找其子孙后代中的元素节点
三。基本过滤选择器
jquery选择器的过滤规则与css中的伪类选择器语法是相同的,都以":"开头。
1. :first 选取第一个元素,例如:$("E:first")。返回单个元素
2. :last 选取最后一个元素,返回单个元素
3. :not(selector) 去除所有与给定选择器匹配的元素,返回集合元素
4. :even 选取索引值为偶数的所有元素,其中索引值从0开始计算,返回集合元素
5. :odd 选取索引值为奇数的所有元素,返回集合元素
6. :eq(index) 选取索引值等于index的元素,其中index从0开始计算,返回集合元素
7. :gt(index) 选取索引值大于index的元素,其中index从0开始计算,返回集合元素
8. :lt(index) 选取索引值小于index的元素,其中index从0开始计算,返回集合元素
9. :header 选取页面所有标题元素h1-h6,返回集合元素
10. :animated 选取当前正在执行动画的所有元素
四。内容过滤选择器
1. :contains(text) 选取含有文本内容为"text"的元素,返回集合元素
2. :empty 选取不含任何子元素或文本的空元素,返回集合元素
3. :has(selector) 选取含有选择器所匹配的元素,返回集合元素
4. :parent 选取含有子元素或者文本的元素标签,返回集合元素
jquery的选择器的更多相关文章
- jQuery 的选择器常用的元素查找方法
jQuery 的选择器常用的元素查找方法 基本选择器: $("#myELement") 选择id值等于myElement的元素,id值不能重复在文档中只能有一个id值是myE ...
- HTML 学习笔记 JQuery(选择器)
学习前端也有一段时间了,今天终于进入到JQuery阶段了,对于新手来讲,JQuery的选择器类型之多 功能之强大实在不是一天两天能够记得完的.现在,就采用边学边记录的方式.以后要是忘了的话,也有一个地 ...
- jQuery的选择器中的通配符总结
1.选择器 (1)通配符: $("input[id^='code']");//id属性以code开始的所有input标签 $("input[id$='code']&quo ...
- JQuery 层次选择器
<!DOCTYPE HTML> <html> <head> <title> 使用jQuery层次选择器 </title> <scrip ...
- jQuery过滤选择器
//基本过滤器$('li:first').css('background','#ccc');//第一个元素$('li:last').css('background','red');//最后一个元素$( ...
- jquery相对选择器,又叫context选择器,上下文选择器;find()与children()区别
jquery相对选择器有两个参数,jQuery函数的第二个参数可以指定DOM元素的搜索范围(即以第二个参数指定的内容为容器查找指定元素). 第二个参数的不同的类型,对应的用法如下表所示. 类型 用法 ...
- jQuery之选择器
jQuery元素选择器和属性选择器允许您通过标签名.属性名或内容对 HTML 元素进行选择和操作,而在 HTML DOM中,选择器可以对DOM元素组或单个DOM 节点进行操作.通俗点说,选择器的作用就 ...
- 关于jquery ID选择器的一点看法
最近看到一道前端面试题: 请优化selector写法:$(".foo div#bar:eq(0)") 我给出的答案会是: 1. $("#bar") 2. $( ...
- jQuery的选择器中的通配符[id^='code'] 【转】
JQuery 1.选择器 (1)通配符: $("input[id^='code']");//id属性以code开始的所有input标签 $("input[id$='cod ...
- jquery下 选择器整理
jQuery 的选择器可谓之强大无比,这里简单地总结一下常用的元素查找方法 $("#myELement") 选择id值等于myElement的元素,id值不能重复在文档中只能有一个 ...
随机推荐
- Android菜单项内容大全
一.介绍: 菜单是许多应用中常见的用户界面组件. Android3.0版本以前,Android设备会提供一个专用"菜单"按钮呈现常用的一些用户操作, Android3.0版本以后, ...
- 编译器开发系列--Ocelot语言3.类型名称的消解
"类型名称的消解"即类型的消解.类型名称由TypeRef 对象表示,类型由Type 对象表示.类型名称的消解就是将TypeRef 对象转换为Type 对象. TypeResolve ...
- git提交项目到已存在的远程分支
今天想提交项目到github的远程分支上,那个远程分支是之前就创建好的,而我的本地关联分支还没创建. 之前从未用github提交到远程分支过,弄了半个钟,看了几篇博文,终于折腾出来.现在把步骤整理 ...
- Atitit.attilax软件研发与项目管理之道
Atitit.attilax软件研发与项目管理之道 1. 前言4 2. 鸣谢4 3. Genesis 创世记4 4. 软件发展史4 5. 箴言4 6. 使徒行传 4 7. attilax书 4 8. ...
- php+websocket搭建简易聊天室实践
1.前言 公司游戏里面有个简单的聊天室,了解了之后才知道是node+websocket做的,想想php也来做个简单的聊天室.于是搜集各种资料看文档.找实例自己也写了个简单的聊天室. http连接分为短 ...
- 浅谈iptables 入站 出站以及NAT实例
--------------本文是自己工作上的笔记总结,适合的可以直接拿去用,不适合的,适当修改即可!--------------- iptbales默认ACCEPT策略,也称通策略,这种情况下可以做 ...
- 第14章 Linux启动管理(3)_系统修复模式
3. 系统修复模式 3.1 单用户模式 (1)在grub界面中选择第2项,并按"e键"进入编辑.并在"-quiet"后面加入" 1",即&q ...
- Leetcode 笔记 117 - Populating Next Right Pointers in Each Node II
题目链接:Populating Next Right Pointers in Each Node II | LeetCode OJ Follow up for problem "Popula ...
- C++模板编程:如何使非通用的模板函数实现声明和定义分离
我们在编写C++类库时,为了隐藏实现,往往只能忍痛舍弃模版的强大特性.但如果我们只需要有限的几个类型的模版实现,并且不允许用户传入其他类型时,我们就可以将实例化的代码放在cpp文件中实现了.然而,当我 ...
- Entity Framework 6 Recipes 2nd Edition(11-5)译 -> 从”模型定义”函数返回一个匿名类型
11-5. 从”模型定义”函数返回一个匿名类型 问题 想创建一个返回一个匿名类型的”模型定义”函数 解决方案 假设已有游客(Visitor) 预订(reservation)房间(hotel ) 的模型 ...