首页
所有分类
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 相关文章推荐
表单的一些基本用法与技巧
Jul 15 Javascript
Javascript事件热键兼容ie|firefox
Dec 30 Javascript
javascript中将Object转换为String函数代码 (json str)
Apr 29 Javascript
利用原生JS自动生成文章标题树的实例
Aug 22 Javascript
谈谈jQuery之Deferred源码剖析
Dec 19 Javascript
详解javascript获取url信息的常见方法
Dec 19 Javascript
js的对象与函数详解
Jan 21 Javascript
微信小程序实现人脸识别登陆的示例代码
Apr 02 Javascript
Vue组件通信中非父子组件传值知识点总结
Dec 05 Javascript
Vue替代marquee标签超出宽度文字横向滚动效果
Dec 09 Javascript
js 计数排序的实现示例(升级版)
Jan 12 Javascript
微信小程序实现左滑删除效果
Nov 18 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
表约束(2) NginxConfig(1) Slave(1) Master(1) 共享文件夹(1) 横向滚动(1) SVN(1) 骨架屏(1) ESXI(1) caddy(1)
You might like
php smarty模版引擎中的缓存应用
2009/12/02 PHP
分享一个PHP数据流应用的简单例子
2012/06/01 PHP
Nginx下配置codeigniter框架方法
2015/04/07 PHP
PHP代码实现爬虫记录――超管用
2015/07/31 PHP
php 判断过去离现在几年的函数(实例代码)
2016/11/15 PHP
PHP pthreads v3下同步处理synchronized用法示例
2020/02/21 PHP
PHP7 新增功能
2021/03/09 PHP
JavaScript Date对象使用总结
2009/05/14 Javascript
JavaScript 申明函数的三种方法 每个函数就是一个对象（一）
2009/12/04 Javascript
js获取input长度并根据页面宽度设置其大小及居中对齐
2014/08/22 Javascript
如何提高javascript加载速度
2016/12/26 Javascript
Vue获取DOM元素样式和样式更改示例
2017/03/07 Javascript
详解VUE中v-bind的基本用法
2017/07/13 Javascript
Vue单页式应用(Hash模式下)实现微信分享的实例
2017/07/21 Javascript
Vue官方推荐AJAX组件axios.js使用方法详解与API
2018/10/09 Javascript
详解从NodeJS搭建中间层再谈前后端分离
2018/11/13 NodeJs
Vue组件内部实现一个双向数据绑定的实例代码
2019/04/04 Javascript
vue router 跳转时打开新页面的示例方法
2019/07/28 Javascript
jQuery zTree插件快速实现目录树
2019/08/16 jQuery
layer.confirm()右边按钮实现href的例子
2019/09/27 Javascript
vue.js中使用微信扫一扫解决invalid signature问题(完美解决)
2020/04/11 Javascript
vue使用better-scroll实现滑动以及左右联动
2020/06/30 Javascript
python通过线程实现定时器timer的方法
2015/03/16 Python
Python冒泡排序注意要点实例详解
2016/09/09 Python
修复CentOS7升级Python到3.6版本后yum不能正确使用的解决方法
2018/01/26 Python
Python实现读取Properties配置文件的方法
2018/03/29 Python
Python设计模式之职责链模式原理与用法实例分析
2019/01/11 Python
python实现屏保程序（适用于背单词）
2019/07/30 Python
使用Tkinter制作信息提示框
2020/02/18 Python
python安装和pycharm环境搭建设置方法
2020/05/27 Python
美国唇部护理专家：Sara Happ
2019/06/19 全球购物
美国第一大药店连锁机构：Walgreens（沃尔格林）
2019/10/10 全球购物
行政总经理岗位职责
2013/12/05 职场文书
网上商城创业计划书范文
2014/01/31 职场文书
离婚财产分隔协议书
2014/10/23 职场文书
Apache Pulsar结合Hudi构建Lakehouse方案分析
2022/03/31 Servers