首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 Javascript

jQuery 获取对象 定位子对象

Posted in Javascript onMay 31, 2010

选择中的特殊符号:

# 指示 id
. 指示 class
* 全选
, 多选
空格 后代
> 子
~ 兄弟
+ 下一个
: 子(多功能)
() 函数式的过滤与查找

获取 div 下的所有标题对象: $("div :header") 

<body> 
<h3>AAA</h3> 
<p>BBB</p> 
<h4>CCC</h4> 
<div> 
<h3>DDD</h3> 
<p>EEE</p> 
<h4>FFF</h4> 
</div> 
</body>

获取所有标题对象: $(":header") 
<body> 
<h3>AAA</h3> 
<p>BBB</p> 
<h4>CCC</h4> 
<div> 
<h3>DDD</h3> 
<p>EEE</p> 
<h4>FFF</h4> 
</div> 
</body>

获取 first, 如: $("li:first") 或 $("li").first() 或 $("ul :first") 或 $("ul li:first") 
<ul> 
<li>AAA</li> 
<li>BBB</li> 
<li>CCC</li> 
<li>DDD</li> 
<li>EEE</li> 
<li>FFF</li> 
<li>GGG</li> 
</ul> 
<ul> 
<li>111</li> 
</ul> 
<ul> 
<li>XXX</li> 
<li>YYY</li> 
<li>ZZZ</li> 
</ul>

获取每组的 first, 如: $("li:first-child") 或 $("ul li:first-child") 或 $("ul :first-child") 
<ul> 
<li>AAA</li> 
<li>BBB</li> 
<li>CCC</li> 
<li>DDD</li> 
<li>EEE</li> 
<li>FFF</li> 
<li>GGG</li> 
</ul> 
<ul> 
<li>111</li> 
</ul> 
<ul> 
<li>XXX</li> 
<li>YYY</li> 
<li>ZZZ</li> 
</ul>

获取 last, 如: $("li:last") 或 $("li").last() 或 $("ul :last") 或 $("ul li:last") 
<ul> 
<li>AAA</li> 
<li>BBB</li> 
<li>CCC</li> 
<li>DDD</li> 
<li>EEE</li> 
<li>FFF</li> 
<li>GGG</li> 
</ul> 
<ul> 
<li>111</li> 
</ul> 
<ul> 
<li>XXX</li> 
<li>YYY</li> 
<li>ZZZ</li> 
</ul>

获取每组的 last, 如: $("li:last-child") 或 $("ul li:last-child") 或 $("ul :last-child") 
<ul> 
<li>AAA</li> 
<li>BBB</li> 
<li>CCC</li> 
<li>DDD</li> 
<li>EEE</li> 
<li>FFF</li> 
<li>GGG</li> 
</ul> 
<ul> 
<li>111</li> 
</ul> 
<ul> 
<li>XXX</li> 
<li>YYY</li> 
<li>ZZZ</li> 
</ul>

获取第几个, 如(获取第三个, eq 是 0 起): $("li:eq(2)") 或 $("li").eq(2) 
<ul> 
<li>AAA</li> 
<li>BBB</li> 
<li>CCC</li> 
<li>DDD</li> 
<li>EEE</li> 
<li>FFF</li> 
<li>GGG</li> 
</ul> 
<ul> 
<li>111</li> 
</ul> 
<ul> 
<li>XXX</li> 
<li>YYY</li> 
<li>ZZZ</li> 
</ul>

获取第几个之后的, 如(获取第三个之后的, gt 是 0 起): $("li:gt(2)") 
<ul> 
<li>AAA</li> 
<li>BBB</li> 
<li>CCC</li> 
<li>DDD</li> 
<li>EEE</li> 
<li>FFF</li> 
<li>GGG</li> 
</ul> 
<ul> 
<li>111</li> 
</ul> 
<ul> 
<li>XXX</li> 
<li>YYY</li> 
<li>ZZZ</li> 
</ul>

获取第几个之前的, 如(获取第三个之前的, lt 是 0 起): $("li:lt(2)") 
<ul> 
<li>AAA</li> 
<li>BBB</li> 
<li>CCC</li> 
<li>DDD</li> 
<li>EEE</li> 
<li>FFF</li> 
<li>GGG</li> 
</ul> 
<ul> 
<li>111</li> 
</ul> 
<ul> 
<li>XXX</li> 
<li>YYY</li> 
<li>ZZZ</li> 
</ul>

获取索引值是偶数的, 如(even 是 0 起): $("li:even") 
<ul> 
<li>AAA</li> 
<li>BBB</li> 
<li>CCC</li> 
<li>DDD</li> 
<li>EEE</li> 
<li>FFF</li> 
<li>GGG</li> 
</ul> 
<ul> 
<li>111</li> 
</ul> 
<ul> 
<li>XXX</li> 
<li>YYY</li> 
<li>ZZZ</li> 
</ul>

获取索引值是奇数的, 如(odd 是 0 起): $("li:odd") 
<ul> 
<li>AAA</li> 
<li>BBB</li> 
<li>CCC</li> 
<li>DDD</li> 
<li>EEE</li> 
<li>FFF</li> 
<li>GGG</li> 
</ul> 
<ul> 
<li>111</li> 
</ul> 
<ul> 
<li>XXX</li> 
<li>YYY</li> 
<li>ZZZ</li> 
</ul>

获取每组第偶数个, 如(nth-child 是 1 起): $("li:nth-child(even)") 
<ul> 
<li>AAA</li> 
<li>BBB</li> 
<li>CCC</li> 
<li>DDD</li> 
<li>EEE</li> 
<li>FFF</li> 
<li>GGG</li> 
</ul> 
<ul> 
<li>111</li> 
</ul> 
<ul> 
<li>XXX</li> 
<li>YYY</li> 
<li>ZZZ</li> 
</ul>

获取每组第奇数个, 如(nth-child 是 1 起): $("li:nth-child(odd)") 
<ul> 
<li>AAA</li> 
<li>BBB</li> 
<li>CCC</li> 
<li>DDD</li> 
<li>EEE</li> 
<li>FFF</li> 
<li>GGG</li> 
</ul> 
<ul> 
<li>111</li> 
</ul> 
<ul> 
<li>XXX</li> 
<li>YYY</li> 
<li>ZZZ</li> 
</ul>

获取每组第几个, 譬如第 2 个(nth-child 是 1 起): $("li:nth-child(2)") 
<ul> 
<li>AAA</li> 
<li>BBB</li> 
<li>CCC</li> 
<li>DDD</li> 
<li>EEE</li> 
<li>FFF</li> 
<li>GGG</li> 
</ul> 
<ul> 
<li>111</li> 
</ul> 
<ul> 
<li>XXX</li> 
<li>YYY</li> 
<li>ZZZ</li> 
</ul>

用表达式指示每组的第几个, 如(nth-child 是 1 起): $("li:nth-child(3n-1)") 
<ul> 
<li>AAA</li> 
<li>BBB</li> 
<li>CCC</li> 
<li>DDD</li> 
<li>EEE</li> 
<li>FFF</li> 
<li>GGG</li> 
</ul> 
<ul> 
<li>111</li> 
</ul> 
<ul> 
<li>XXX</li> 
<li>YYY</li> 
<li>ZZZ</li> 
</ul>

如果是父元素中唯一的子元素, 如: $("li:only-child") 
<ul> 
<li>AAA</li> 
<li>BBB</li> 
<li>CCC</li> 
<li>DDD</li> 
<li>EEE</li> 
<li>FFF</li> 
<li>GGG</li> 
</ul> 
<ul> 
<li>111</li> 
</ul> 
<ul> 
<li>XXX</li> 
<li>YYY</li> 
<li>ZZZ</li> 
</ul>

:not 是对其他选择的取反, 如: $("li:not(li:first-child)") 
<ul> 
<li>AAA</li> 
<li>BBB</li> 
<li>CCC</li> 
<li>DDD</li> 
<li>EEE</li> 
<li>FFF</li> 
<li>GGG</li> 
</ul> 
<ul> 
<li>111</li> 
</ul> 
<ul> 
<li>XXX</li> 
<li>YYY</li> 
<li>ZZZ</li> 
</ul>

jQuery 获取对象 定位子对象

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐
jQuery中的常用事件总结
Dec 27 Javascript
Jquery Autocomplete 结合asp.net使用要点
Oct 29 Javascript
javascript Event对象详解及使用示例
Nov 22 Javascript
JS图片自动轮换效果实现思路附截图
Apr 30 Javascript
浅谈轻量级js模板引擎simplite
Feb 13 Javascript
js实现超简单的展开、折叠目录代码
Aug 28 Javascript
js原生之焦点图转换加定时器实例
Dec 12 Javascript
详解jQuery停止动画——stop()方法的使用
Dec 14 Javascript
微信小程序 地图map实例详解
Jun 07 Javascript
Node.js pipe实现源码解析
Aug 12 Javascript
js注册时输入合法性验证方法
Oct 21 Javascript
jQuery 获取对象 基本选择与层级
May 31 #Javascript
javascript 判断数组是否已包含了某个元素的函数
May 30 #Javascript
基于jquery的inputlimiter 实现字数限制功能
May 30 #Javascript
JQuery Easyui Tree的oncheck事件实现代码
May 28 #Javascript
一个收集图片的bookmarlet(js 刷新页面中的图片)
May 27 #Javascript
js实现GridView单选效果自动设置交替行、选中行、鼠标移动行背景色
May 27 #Javascript
Javascript 设计模式（二） 闭包
May 26 #Javascript
事件调度器(1) Yolov5(1) 监听(2) scss(1) watch(1) vue-router-link(1) TimePickerView(1) vue-cli3.x(1) 项目打包(2) sched(1)
You might like
Javascript 刷新全集常用代码
2009/11/22 Javascript
基于jquery可配置循环左右滚动例子
2011/09/09 Javascript
js控制页面的全屏展示和退出全屏显示的方法
2015/03/10 Javascript
JavaScript的jQuery库中function的存在和参数问题
2015/08/13 Javascript
JavaScript实现表格快速变色效果代码
2015/08/19 Javascript
基于JavaScript如何实现ajax调用后台定义的方法
2015/12/29 Javascript
js+canvas绘制矩形的方法
2016/01/28 Javascript
使用JavaScript触发过渡效果的方法
2017/01/19 Javascript
AngularJS中$injector、$rootScope和$scope的概念和关联关系深入分析
2017/01/19 Javascript
Bootstrap 下拉多选框插件Bootstrap Multiselect
2017/01/22 Javascript
微信小程序如何获知用户运行小程序的场景教程
2017/05/17 Javascript
JavaScript数据类型的存储方法详解
2017/08/25 Javascript
Vue官方文档梳理之全局配置
2017/11/22 Javascript
vue学习笔记五：在vue项目里面使用引入公共方法详解
2019/04/04 Javascript
小程序实现可拖动的悬浮按钮
2020/09/07 Javascript
区分vue-router的hash和history模式
2020/10/03 Javascript
[00:44]华丽开场！DOTA2勇士令状带来全新对阵画面
2019/05/15 DOTA
[01:23:45]DOTA2-DPC中国联赛 正赛 CDEC vs Dragon BO3 第一场 1月22日
2021/03/11 DOTA
分享一下Python 开发者节省时间的10个方法
2015/10/02 Python
Python_LDA实现方法详解
2017/10/25 Python
python实现画圆功能
2018/01/25 Python
用python与文件进行交互的方法
2018/03/01 Python
Python写捕鱼达人的游戏实现
2020/03/31 Python
python读取yaml文件后修改写入本地实例
2020/04/27 Python
python使用QQ邮箱实现自动发送邮件
2020/06/22 Python
世界上最大的在线旅行社新加坡网站：Expedia新加坡
2016/08/25 全球购物
Brookstone美国官网：独特新奇产品
2017/03/04 全球购物
音乐教学案例
2014/01/30 职场文书
职务说明书范文
2014/05/07 职场文书
酒店开业庆典策划方案
2014/05/28 职场文书
教师拔河比赛广播稿
2014/10/14 职场文书
运动会1000米加油稿
2015/07/21 职场文书
和领导吃饭祝酒词
2015/08/11 职场文书
苹果M1芯片安装nginx 并且部署vue项目步骤详解
2021/11/20 Servers
恶魔之树最顶端的三颗果实 震震果实上榜,第一可以制造岩浆
2022/03/18 日漫
Python selenium绕过webdriver监测执行javascript
2022/04/12 Python