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 图片预览效果 推荐
Dec 22 Javascript
基于Jquery的回车成tab焦点切换效果代码(Enter To Tab )
Nov 14 Javascript
你需要知道的10个最佳javascript开发实践小结
Apr 15 Javascript
使用Chrome调试JavaScript的断点设置和调试技巧
Dec 16 Javascript
解决jQuery使用JSONP时产生的错误
Dec 02 Javascript
Bootstrap学习笔记之css组件(3)
Jun 07 Javascript
BootStrap表单验证 FormValidation 调整反馈图标位置的实例代码
May 17 Javascript
Vue项目全局配置页面缓存之按需读取缓存的实现详解
Aug 01 Javascript
详解Vue webapp项目通过HBulider打包原生APP(vue+webpack+HBulider)
Feb 02 Javascript
JS定义函数的几种常用方法小结
May 23 Javascript
javascript面向对象三大特征之继承实例详解
Jul 24 Javascript
vue解决使用$http获取数据时报错的问题
Oct 30 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
PHP文件上传实例详解!!!
2007/01/02 PHP
使用XDebug调试及单元测试覆盖率分析
2011/01/27 PHP
PHP下使用CURL方式POST数据至API接口的代码
2013/02/14 PHP
PHP使用正则表达式清除超链接文本
2013/11/12 PHP
php内嵌函数用法实例
2015/03/20 PHP
PHP使用mysqldump命令导出数据库
2015/04/14 PHP
Laravel5.1 框架Middleware中间件基本用法实例分析
2020/01/04 PHP
jquery获取input表单值的代码
2010/04/19 Javascript
使用jQuery模板来展现json数据的代码
2010/10/22 Javascript
javascript自动给文本url地址增加链接的方法分享
2014/01/20 Javascript
javascript刷新父页面的各种方法汇总
2014/09/03 Javascript
JavaScript中Function函数与Object对象的关系
2015/12/17 Javascript
javascript时间戳和日期字符串相互转换代码(超简单)
2016/06/22 Javascript
原生JS实现首页进度加载动画
2016/09/14 Javascript
如何提高Dom访问速度
2017/01/05 Javascript
JavaScript Date对象应用实例分享
2017/10/30 Javascript
Vue组件开发技巧总结
2018/03/04 Javascript
JS匿名函数和匿名自执行函数概念与用法分析
2018/03/16 Javascript
利用Node.js批量抓取高清妹子图片实例教程
2018/08/02 Javascript
详解Vue中数组和对象更改后视图不刷新的问题
2018/09/21 Javascript
Webpack按需加载打包chunk命名的方法
2019/09/22 Javascript
VSCode写vue项目一键生成.vue模版,修改定义其他模板的方法
2020/04/17 Javascript
python实现猜数字小游戏
2020/03/24 Python
Python3.6简单的操作Mysql数据库的三个实例
2018/10/17 Python
使用pyinstaller逆向.pyc文件
2019/12/20 Python
详解使用python3.7配置开发钉钉群自定义机器人(2020年新版攻略)
2020/04/01 Python
Html5应用程序缓存(Cache manifest)
2018/06/04 HTML / CSS
莫斯科的韩国化妆品店:Sifo
2019/12/04 全球购物
蛋糕店的商业计划书范文
2014/01/27 职场文书
园艺师求职信
2014/03/10 职场文书
英语自我介绍演讲稿
2014/09/01 职场文书
党员学习群众路线心得体会
2014/11/04 职场文书
2014年社团工作总结范文
2014/11/27 职场文书
中学生社区服务活动报告
2015/02/05 职场文书
《小蝌蚪找妈妈》教学反思
2016/02/23 职场文书
Mysql效率优化定位较低sql的两种方式
2021/05/26 MySQL