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等比例缩放图片控制超出范围的图片
Aug 06 Javascript
JavaScript移除数组元素减少长度的方法
Sep 05 Javascript
JS获取当前网页大小以及屏幕分辨率等
Sep 05 Javascript
使用JavaScript为Kindeditor自定义按钮增加Audio标签
Mar 18 Javascript
深入理解Javascript中的自执行匿名函数
Jun 03 Javascript
jquery实现input框获取焦点的方法
Feb 06 Javascript
Vue2.0 UI框架ElementUI使用方法详解
Apr 14 Javascript
JS实现将链接生成二维码并转为图片的方法
Mar 17 Javascript
详解create-react-app 2.0版本如何启用装饰器语法
Oct 23 Javascript
Vue 动态组件components和v-once指令的实现
Aug 30 Javascript
layer 刷新某个页面的实现方法
Sep 05 Javascript
OpenLayers实现图层切换控件
Sep 25 Javascript
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
神族 PROTOSS 概述
2020/03/14 星际争霸
YB217、YB235、YB400浅听
2021/03/02 无线电
PHP Curl多线程原理实例详解
2013/11/06 PHP
php将access数据库转换到mysql数据库的方法
2014/12/24 PHP
PHP设计模式之观察者模式实例
2016/02/22 PHP
php Session无效分析资料整理
2016/11/29 PHP
关于php支持的协议与封装协议总结(推荐)
2017/11/17 PHP
JQuery与Ajax常用代码实现对比
2009/10/03 Javascript
js 实现图片预加载(js操作 Image对象属性complete ,事件onload 异步加载图片)
2011/03/25 Javascript
javascript获取网页中指定节点的父节点、子节点的方法小结
2013/04/24 Javascript
js编写trim()函数及正则表达式的运用
2013/10/24 Javascript
JQuery获取表格数据示例代码
2014/05/26 Javascript
浅谈js的setInterval事件
2014/12/05 Javascript
JavaScript基于ajax编辑信息用法实例
2015/07/15 Javascript
jQuery Chart图表制作组件Highcharts用法详解
2016/06/01 Javascript
JavaScript 限制文本框不可输入英文单双引号的方法
2016/12/20 Javascript
JavaScript高阶函数_动力节点Java学院整理
2017/06/28 Javascript
js微信应用场景之微信音乐相册案例分享
2017/08/11 Javascript
vue中父子组件注意事项,传值及slot应用技巧
2018/05/09 Javascript
vue实现word,pdf文件的导出功能
2018/07/31 Javascript
python基础教程之缩进介绍
2014/08/29 Python
Python实现竖排打印传单手机号码易撕条
2015/03/16 Python
Python获取运行目录与当前脚本目录的方法
2015/06/01 Python
Anaconda+Pycharm环境下的PyTorch配置方法
2020/03/13 Python
canvas三角函数模拟水波效果的示例代码
2018/07/03 HTML / CSS
西班牙宠物用品和食品网上商店:Tiendanimal
2019/06/06 全球购物
英国电信商店:BT Shop
2019/12/17 全球购物
花店创业计划书范文
2014/02/07 职场文书
八一建军节感言
2014/02/28 职场文书
幼儿园个人师德总结
2015/02/06 职场文书
亚布力滑雪场导游词
2015/02/09 职场文书
统计工作个人总结
2015/03/03 职场文书
物业保安辞职信
2015/05/12 职场文书
python删除csv文件的行列
2021/04/06 Python
Java实现多线程聊天室
2021/06/26 Java/Android
《杜鹃的婚约》OP主题曲「凸凹」无字幕影像公开
2022/04/08 日漫