jQuery中next方法用法实例


Posted in Javascript onApril 24, 2015

本文实例讲述了jQuery中next方法用法。分享给大家供大家参考。具体分析如下:

这里演示jQuery中next的用法,可取得一个包含匹配的元素集合中每一个元素紧邻的后面同辈元素的元素集合。

这个函数只返回后面那个紧邻的同辈元素,而不是后面所有的同辈元素。

可以用一个可选的表达式进行筛选

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>next的用法</title> 
<script type="text/javascript" src="/ajaxjs/jquery1.3.2.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() {
  $("span").click(function(){alert($("p").next(".selected").html());})
  // $("p").next().html() 也可以 
});
</script>
</head>
<body>
<p>Hello</p><p class="selected">这里的内容将显示</p><div>
<span>点我测试</span>
</div>
<!--取得一个包含匹配的元素集合中每一个元素紧邻的后面同辈元素的元素集合。
这个函数只返回后面那个紧邻的同辈元素,而不是后面所有的同辈元素。
可以用一个可选的表达式进行筛选。 
-->
</body> 
</html>

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
Javascript 网页水印(非图片水印)实现代码
Mar 01 Javascript
filters.revealTrans.Transition使用方法小结
Aug 19 Javascript
纯JAVASCRIPT图表动画插件Highcharts Examples
Apr 16 Javascript
JS中判断null、undefined与NaN的方法
Mar 24 Javascript
JavaScript获取图片真实大小代码实例
Sep 24 Javascript
ES6新特性八:async函数用法实例详解
Apr 21 Javascript
js装饰设计模式学习心得
Feb 17 Javascript
VUE组件中的 Drawer 抽屉实现代码
Aug 06 Javascript
2019年度web前端面试题总结(主要为Vue面试题)
Jan 12 Javascript
JavaScript代理模式原理与用法实例详解
Mar 10 Javascript
Vue实现图书管理小案例
Dec 03 Vue.js
手动实现vue2.0的双向数据绑定原理详解
Feb 06 Vue.js
JavaScript实现多个重叠层点击切换效果的方法
Apr 24 #Javascript
javascript实现的右下角弹窗实例
Apr 24 #Javascript
js上传图片及预览功能实例分析
Apr 24 #Javascript
浅谈jquery事件处理
Apr 24 #Javascript
js完美解决IE6不支持position:fixed的bug
Apr 24 #Javascript
JS实现简单的键盘打字的效果
Apr 24 #Javascript
javascript中replace( )方法的使用
Apr 24 #Javascript
You might like
不用数据库的多用户文件自由上传投票系统(3)
2006/10/09 PHP
php5 pdo新改动加载注意事项
2008/09/11 PHP
基于session_unset与session_destroy的区别详解
2013/06/03 PHP
ThinkPHP标签制作教程
2014/07/10 PHP
smarty模板引擎使用内建函数foreach循环取出所有数组值的方法
2015/01/22 PHP
php+mysqli批量查询多张表数据的方法
2015/01/29 PHP
在Mac OS的PHP环境下安装配置MemCache的全过程解析
2016/02/15 PHP
javascript 页面只自动刷新一次
2009/07/10 Javascript
JavaScript高级程序设计 扩展--关于动态原型
2010/11/09 Javascript
jQuery+ajax实现鼠标单击修改内容的方法
2014/06/27 Javascript
ECMAScript 5中的属性描述符详解
2015/03/02 Javascript
jQuery实现可以控制图片旋转角度效果(附demo源码下载)
2016/01/27 Javascript
JS组件系列之Bootstrap Icon图标选择组件
2016/01/28 Javascript
用Vue.extend构建消息提示组件的方法实例
2017/08/08 Javascript
基于vue监听滚动事件实现锚点链接平滑滚动的方法
2018/01/17 Javascript
vue实现点击关注后及时更新列表功能
2018/06/26 Javascript
小程序接口的promise化的实现方法
2019/12/11 Javascript
python3使用urllib示例取googletranslate(谷歌翻译)
2014/01/23 Python
Python代码的打包与发布详解
2014/07/30 Python
Python3指定路径寻找符合匹配模式文件
2015/05/22 Python
python生成器,可迭代对象,迭代器区别和联系
2018/02/04 Python
对Python 窗体(tkinter)树状数据(Treeview)详解
2018/10/11 Python
python实现静态web服务器
2019/09/03 Python
pycharm双击无响应(打不开问题解决办法)
2020/01/10 Python
python和pywin32实现窗口查找、遍历和点击的示例代码
2020/04/01 Python
elf彩妆英国官网:e.l.f. Cosmetics英国(美国平价彩妆品牌)
2017/11/02 全球购物
美国优质宠物用品购买网站:Muttropolis
2020/02/17 全球购物
梅西百货官网:Macy’s
2020/08/04 全球购物
mysql的最长数据库名,表名,字段名可以是多长
2014/04/21 面试题
请说出以下代码输出什么
2013/08/30 面试题
应用电子技术专业个人求职信
2013/09/21 职场文书
元宵节寄语大全
2015/02/27 职场文书
2016七夕情人节寄语
2015/12/04 职场文书
班组长如何制订适合本班组的工作计划?
2019/07/10 职场文书
超级详细实用的pycharm常用快捷键
2021/05/12 Python
解决mysql模糊查询索引失效问题的几种方法
2021/06/18 MySQL