首页
所有分类
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 相关文章推荐
XMLHTTPRequest的属性和方法简介
Nov 23 Javascript
jQuery教程 $()包装函数来实现数组元素分页效果
Aug 13 Javascript
JS 数字转换研究总结
Dec 26 Javascript
js跨域访问示例(客户端/服务端)
May 19 Javascript
jQuery中click事件的定义和用法
Dec 20 Javascript
详解为Angular.js内置$http服务添加拦截器的方法
Dec 20 Javascript
使用OPENLAYERS3实现点选的方法
Sep 24 Javascript
详谈Node.js之操作文件系统
Aug 29 Javascript
详解react-refetch的使用小例子
Feb 15 Javascript
如何在项目中使用log4.js的方法步骤
Jul 16 Javascript
js+html实现点名系统功能
Nov 05 Javascript
jQuery利用cookie 实现本地收藏功能(不重复无需多次命名)
Nov 07 jQuery
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
事务(5) 弱口令(1) 访问日志(2) 锁(1) 缓存(3) 连接数(1) 内存(1) 策略(1) ipv6(1) 线程(1)
You might like
也谈 PHP 和 MYSQL
2006/10/09 PHP
实例介绍PHP删除数组中的重复元素
2019/03/03 PHP
使用Git实现Laravel项目的自动化部署
2019/11/24 PHP
jQuery 获取URL的GET参数值的小例子
2013/04/18 Javascript
如何获取select下拉框的值(option没有及有value属性)
2013/11/08 Javascript
jQuery中addClass()方法用法实例
2015/01/05 Javascript
JavaScript数组的栈方法与队列方法详解
2016/05/26 Javascript
JQuery异步加载PartialView的方法
2016/06/07 Javascript
ionic实现滑动的三种方式
2016/08/27 Javascript
微信小程序 WebSocket详解及应用
2017/01/21 Javascript
vue.js实现请求数据的方法示例
2017/02/07 Javascript
Ant Design Vue table中列超长显示...并加提示语的实例
2020/10/31 Javascript
[38:38]完美世界DOTA2联赛PWL S3 access vs Rebirth 第二场 12.17
2020/12/18 DOTA
python基础教程之实现石头剪刀布游戏示例
2014/02/11 Python
python通过colorama模块在控制台输出彩色文字的方法
2015/03/19 Python
详解Python中列表和元祖的使用方法
2015/04/25 Python
关于Python面向对象编程的知识点总结
2017/02/14 Python
浅谈python新式类和旧式类区别
2019/04/26 Python
Python列表原理与用法详解【创建、元素增加、删除、访问、计数、切片、遍历等】
2019/10/30 Python
使用Python给头像加上圣诞帽或圣诞老人小图标附源码
2019/12/25 Python
浅析Python迭代器的高级用法
2020/07/16 Python
django数据模型中null和blank的区别说明
2020/09/02 Python
python unichr函数知识点总结
2020/12/16 Python
一波HTML5 Canvas基础绘图实例代码集合
2016/02/28 HTML / CSS
ECOSUSI官网：女式皮革背包
2019/09/27 全球购物
SQL语言面试题
2013/08/27 面试题
如何写毕业求职自荐信
2013/11/06 职场文书
数控技术应届生求职信
2013/11/13 职场文书
小学教师办公室制度
2014/02/03 职场文书
人代会标语
2014/06/30 职场文书
2014年大学班长工作总结
2014/11/14 职场文书
英文感谢信格式
2015/01/21 职场文书
“5.12”护士节主持词
2015/07/04 职场文书
廉政党课工作报告案例
2019/06/21 职场文书
竞选稿之小学班干部
2019/10/31 职场文书
关于mysql中string和number的转换问题
2022/06/14 MySQL