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 模式实例 观察者模式
Oct 24 Javascript
JAVASCRIPT style 中visibility和display之间的区别
Jan 22 Javascript
js自定义事件代码说明
Jan 31 Javascript
javascript权威指南 学习笔记之变量作用域分享
Sep 28 Javascript
JavaScript判断DOM何时加载完毕的技巧
Nov 11 Javascript
浅析javascript 定时器
Dec 23 Javascript
JavaScript删除指定子元素代码实例
Jan 13 Javascript
jQuery遮罩层效果实例分析
Jan 14 Javascript
解决wx.onMenuShareTimeline出现的问题
Aug 16 Javascript
基于JavaScript实现随机颜色输入框
Dec 10 Javascript
详解Vue源码之数据的代理访问
Dec 11 Javascript
JavaScript判断数据类型有几种方法及区别介绍
Sep 02 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
精美漂亮的php分页类代码
2013/04/02 PHP
PHP register_shutdown_function()函数的使用示例
2015/06/23 PHP
PHP判断是否是微信打开还是浏览器打开的方法
2019/02/27 PHP
PHP删除数组中特定元素的两种方法
2019/02/28 PHP
PHP7新功能总结
2019/04/14 PHP
Jquery利用mouseenter和mouseleave实现鼠标经过弹出层且可以点击
2014/02/12 Javascript
jQuery调取jSon数据并展示的方法
2015/01/29 Javascript
使用pjax实现无刷新更改页面url
2015/02/05 Javascript
JavaScript中使用自然对数ln的方法
2015/06/14 Javascript
Jquery跨域获得Json的简单实例
2016/05/18 Javascript
Bootstrap轮播插件简单使用方法介绍
2016/06/21 Javascript
JS给swf传参数的实现方法
2016/09/13 Javascript
MUI 解决动态列表页图片懒加载再次加载不成功的bug问题
2017/04/13 Javascript
深入理解移动前端开发之viewport
2018/10/19 Javascript
js中call()和apply()改变指针问题的讲解
2019/01/17 Javascript
ES6入门教程之let、const的使用方法
2019/04/13 Javascript
es6函数之尾递归用法实例分析
2020/04/25 Javascript
详解vue修改elementUI的分页组件视图没更新问题
2020/11/13 Javascript
[15:46]教你分分钟做大人——沙王
2015/03/11 DOTA
python使用PIL模块实现给图片打水印的方法
2015/05/22 Python
Python循环结构的应用场景详解
2019/07/11 Python
pandas中ix的使用详细讲解
2020/03/09 Python
python:批量统计xml中各类目标的数量案例
2020/03/10 Python
在CentOS7下安装Python3教程解析
2020/07/09 Python
python3.5的包存放的具体路径
2020/08/16 Python
Python __slots__的使用方法
2020/11/15 Python
css3针对移动端卡顿问题的解决(动画性能优化)
2020/02/14 HTML / CSS
东芝官网商城:还原日式美学,打造美好生活
2018/12/27 全球购物
高分子材料个人求职信范文
2013/09/25 职场文书
情况说明书格式范文
2014/05/06 职场文书
升学宴学生答谢词
2015/01/05 职场文书
个人年底工作总结
2015/03/10 职场文书
建党伟业电影观后感
2015/06/01 职场文书
解除合同协议书范本
2016/03/21 职场文书
小学四年级作文之最感动的一件事
2019/11/01 职场文书
Vue的列表之渲染,排序,过滤详解
2022/02/24 Vue.js