首页
所有分类
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 相关文章推荐
HTML-CSS群中单选引发的“事件”
Mar 05 Javascript
基于JavaScript实现动态添加删除表格的行
Feb 01 Javascript
ECHO.js 纯javascript轻量级延迟加载的实例代码
May 24 Javascript
js实现的xml对象转json功能示例
Dec 24 Javascript
js实现五星评价功能
Mar 08 Javascript
vue2.0与bootstrap3实现列表分页效果
Nov 28 Javascript
vue.js整合mint-ui里的轮播图实例代码
Dec 27 Javascript
redux中间件之redux-thunk的具体使用
Apr 17 Javascript
JS数组降维的实现Array.prototype.concat.apply([], arr)
Apr 28 Javascript
vue 清空input标签 中file的值操作
Jul 21 Javascript
详解vue路由
Aug 05 Javascript
关于React Native 无法链接模拟器的问题
Jun 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
redis shake(1) 分析统计(1) 条形图(1) 阿里云(6) ipyvizzu(1) 排名(1) 窗口函数(3) matplotlib(7) 数据同步(1) 可视化动图(1)
You might like
php中用foreach来操作数组的代码
2011/07/17 PHP
在smarty中调用php内置函数的方法
2013/02/07 PHP
利用php绘制饼状图的实现代码
2013/06/07 PHP
php session劫持和防范的方法
2013/11/12 PHP
初窥JQuery(二) 事件机制(1)
2010/11/25 Javascript
让js弹出窗口居前显示的实现方法
2013/07/10 Javascript
Javascript中call和apply函数的比较和使用实例
2015/02/03 Javascript
jQuery实现加入购物车飞入动画效果
2015/03/14 Javascript
js实现网页多级级联菜单代码
2015/08/20 Javascript
Javascript中判断一个值是否为undefined的方法详解
2016/09/28 Javascript
Bootstrap基本插件学习笔记之轮播幻灯片(23)
2016/12/08 Javascript
详解js中常规日期格式处理、月历渲染和倒计时函数
2016/12/28 Javascript
Js自动截取字符串长度,添加省略号(……)的实现方法
2017/03/06 Javascript
AngularJS 实现点击按钮获取验证码功能实例代码
2017/07/13 Javascript
vue Render中slots的使用的实例代码
2017/07/19 Javascript
jquery在vue脚手架中的使用方式示例
2017/08/29 jQuery
Vue的百度地图插件尝试使用
2017/09/06 Javascript
对Vue2 自定义全局指令Vue.directive和指令的生命周期介绍
2018/08/30 Javascript
react项目如何使用iconfont的方法步骤
2019/03/13 Javascript
vue 开发企业微信整合案例分析
2019/12/02 Javascript
浅谈JavaScript 声明提升
2020/09/14 Javascript
python查找第k小元素代码分享
2013/12/18 Python
OpenCV HSV颜色识别及HSV基本颜色分量范围
2019/03/22 Python
python使用Plotly绘图工具绘制气泡图
2019/04/01 Python
HTML5 Canvas绘制文本及图片的基础教程
2016/03/14 HTML / CSS
Kenneth Cole官网：纽约时尚优雅品牌
2016/11/14 全球购物
设计师家具购买和委托在线市场：Viyet
2016/11/16 全球购物
美国第一香水网站：Perfume.com
2017/01/23 全球购物
台湾前三大B2C购物网站：MOMO购物网
2017/04/27 全球购物
Calzedonia美国官网：意大利风格袜子、打底裤和沙滩装
2018/07/19 全球购物
毕业生幼师求职自荐信
2013/10/01 职场文书
委托证明书
2014/09/17 职场文书
四风问题班子对照检查材料
2014/09/27 职场文书
四风查摆问题自查报告
2014/10/10 职场文书
个人作风建设总结
2014/10/23 职场文书
Mysql排序的特性详情
2021/11/01 MySQL