jQuery基于当前元素进行下一步的遍历


Posted in Javascript onMay 20, 2014

如果我们已经通过jQuery方法选中了一组元素,那么如何基于这些已经选中的元素进行下一步的遍历呢?

例如,我们通过

$('li:eq(1)')

选中了以下代码中的第二个li元素。

<ul> 
<li><a href="#">link</a></li> 
<li><a href="#">selected link</a></li> 
<li><a href="#">link</a></li> 
<li><a href="#">link</a></li> 
</ul>

基于这个选中的元素,我们可以进一步遍历其他元素

下一个元素

$('li:eq(1)').next()

前一个元素

$('li:eq(1)').prev()

父元素

$('li:eq(1)').parent()

所有兄弟元素

$('li:eq(1)').parent().children()

所有后续兄弟元素

$('li:eq(1)').nextAll()

所有前续兄弟元素

$('li:eq(1)').prevAll()

以上所有的遍历方法都可以使用end()方法来取消操作。

当然,也可以使用参数,例如

$('li:eq(1)').parent().children(':last')

Javascript 相关文章推荐
javascript 在firebug调试时用console.log的方法
May 10 Javascript
jQuery学习笔记 操作jQuery对象 文档处理
Sep 19 Javascript
如何获取select下拉框的值(option没有及有value属性)
Nov 08 Javascript
javascript跨域的4种方法和原理详解
Apr 08 Javascript
jQuery实现form表单元素序列化为json对象的方法
Dec 09 Javascript
jQuery UI插件实现百度提词器效果
Nov 21 Javascript
任意Json转成无序列表的方法示例
Dec 09 Javascript
基于JS实现html中placeholder属性提示文字效果示例
Apr 19 Javascript
angular 数据绑定之[]和{{}}的区别
Sep 25 Javascript
Vue.js实现可编辑的表格
Dec 11 Javascript
详解JS函数防抖
Jun 05 Javascript
JavaScript中常用的3种弹出提示框(alert、confirm、prompt)
Nov 10 Javascript
jQuery 删除/替换DOM元素的几种方式
May 20 #Javascript
php实例分享之实现显示网站运行时间
May 20 #Javascript
jQuery使用andSelf()来包含之前的选择集
May 19 #Javascript
JQuery弹出层示例可自定义
May 19 #Javascript
textarea焦点的用法实现获取焦点清空失去焦点提示效果
May 19 #Javascript
js跨域访问示例(客户端/服务端)
May 19 #Javascript
jquery 表格排序、实时搜索表格内容(附图)
May 19 #Javascript
You might like
全国FM电台频率大全 - 20 广西省
2020/03/11 无线电
php批量删除数据
2007/01/18 PHP
深入理解PHP原理之异常机制
2010/08/21 PHP
PHP使用pcntl_fork实现多进程下载图片的方法
2014/12/16 PHP
PHP实现Google plus的好友拖拽分组效果
2016/10/21 PHP
浅谈PHP中new self()和new static()的区别
2017/08/11 PHP
PHP实现简单用户登录界面
2019/10/23 PHP
加速IE的Javascript document输出的方法
2010/12/02 Javascript
JavaScript实现向setTimeout执行代码传递参数的方法
2015/04/16 Javascript
使用Raygun来自动追踪AngularJS中的异常
2015/06/23 Javascript
学习JavaScript设计模式之责任链模式
2016/01/18 Javascript
浅析JavaScript 箭头函数 generator Date JSON
2016/05/23 Javascript
livereload工具实现前端可视化开发【推荐】
2016/12/23 Javascript
JS完成画圆圈的小球
2017/03/07 Javascript
浅谈vue中关于checkbox数据绑定v-model指令的个人理解
2018/11/14 Javascript
小试SVG之新手小白入门教程
2019/01/08 Javascript
微信小程序实现张图片合成为一张并下载
2019/07/16 Javascript
vue 导出文件,携带请求头token操作
2020/09/10 Javascript
js通过canvas生成图片缩略图
2020/10/02 Javascript
python 环境变量和import模块导入方法(详解)
2017/07/11 Python
Django中Forms的使用代码解析
2018/02/10 Python
详解Python中的测试工具
2019/06/09 Python
Django在pycharm下修改默认启动端口的方法
2019/07/26 Python
Pycharm-community-2020.2.3 社区版安装教程图文详解
2020/12/08 Python
Crabtree & Evelyn英国官网:瑰珀翠护手霜、香水、沐浴和身体护理
2018/04/26 全球购物
Volcom英国官方商店:美国殿堂级滑板、冲浪、滑雪服装品牌
2019/03/13 全球购物
Michael Kors加拿大官网:购买设计师手袋、手表、鞋子、服装等
2019/03/16 全球购物
北京某科技有限公司C# .net笔试题
2014/09/27 面试题
Java面试题:Java类的Main方法如果是Private将会怎么样
2016/08/18 面试题
拖鞋店创业计划书
2014/01/15 职场文书
电脑售后服务承诺书
2014/03/27 职场文书
学习雷锋做美德少年寄语大全
2014/04/09 职场文书
学校政风行风自查自纠报告
2014/10/21 职场文书
见义勇为事迹材料
2014/12/24 职场文书
2015年社区重阳节活动总结
2015/07/30 职场文书
CSS3实现360度循环旋转功能
2022/02/12 HTML / CSS