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 相关文章推荐
Extjs 3.3切换tab隐藏相应工具栏出现空白解决
Apr 02 Javascript
JavaScript利用正则表达式去除日期中的-
Jun 09 Javascript
JavaScript使用ActiveXObject访问Access和SQL Server数据库
Apr 02 Javascript
jQuery设计思想
Mar 07 Javascript
require.js中的define函数详解
Jul 10 Javascript
解决jquery appaend元素中id绑定事件失效的问题
Sep 12 jQuery
JS二分查找算法详解
Nov 01 Javascript
react 实现页面代码分割、按需加载的方法
Apr 03 Javascript
如何使用webpack打包一个库library的方法步骤
Dec 18 Javascript
JS脚本实现定时到网站上签到/签退功能
Apr 22 Javascript
JavaScript多种图形实现代码实例
Jun 28 Javascript
关于Vue Router的10条高级技巧总结
May 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
php 注册时输入信息验证器的实现详解
2013/07/05 PHP
PHP字符串比较函数strcmp()和strcasecmp()使用总结
2014/11/19 PHP
PHP实现PDO操作mysql存储过程示例
2019/02/13 PHP
thinkphp5 + ajax 使用formdata提交数据(包括文件上传) 后台返回json完整实例
2020/03/02 PHP
js 单引号 传递方法
2009/06/22 Javascript
向大师们学习Javascript(视频与PPT)
2009/12/27 Javascript
点击隐藏页面左栏或右栏实现js代码
2013/04/01 Javascript
js限制文本框只能输入整数或者带小数点的数字
2015/04/27 Javascript
MVC+jQuery.Ajax异步实现增删改查和分页
2020/12/22 Javascript
jQuery验证插件validate使用方法详解
2020/09/13 Javascript
详解Vue.js——60分钟组件快速入门(上篇)
2016/12/05 Javascript
Node解决简单重复问题系列之Excel内容的获取
2018/01/02 Javascript
基于Vue、Vuex、Vue-router实现的购物商城(原生切换动画)效果
2018/01/09 Javascript
vue组件横向树实现代码
2018/08/02 Javascript
工作中常用到的ES6语法
2018/09/04 Javascript
详解Webstorm 下的Angular2.0开发之路(图文)
2018/12/06 Javascript
使用Angular9和TypeScript开发RPG游戏的方法
2020/03/25 Javascript
[01:10:24]DOTA2-DPC中国联赛 正赛 VG vs Aster BO3 第一场 2月28日
2021/03/11 DOTA
python3简单实现微信爬虫
2015/04/09 Python
Python中的模块和包概念介绍
2015/04/13 Python
python读写ini配置文件方法实例分析
2015/06/30 Python
python中如何使用朴素贝叶斯算法
2017/04/06 Python
python安装Scrapy图文教程
2017/08/14 Python
浅谈python和C语言混编的几种方式(推荐)
2017/09/27 Python
机器学习经典算法-logistic回归代码详解
2017/12/22 Python
使用python3调用wxpy模块监控linux日志并定时发送消息给群组或好友
2019/06/05 Python
pyqt5实现按钮添加背景图片以及背景图片的切换方法
2019/06/13 Python
python正则表达式 匹配反斜杠的操作方法
2020/08/07 Python
日本快乐生活方式购物网站:Shop Japan
2018/07/17 全球购物
偷看我的初中毕业鉴定
2014/01/29 职场文书
基层党建工作宣传标语
2014/06/24 职场文书
竞聘报告优秀范文
2014/11/06 职场文书
表扬稿范文
2015/01/17 职场文书
病人家属写给医院的感谢信
2015/01/23 职场文书
《西游记》读后感(3篇)
2019/09/20 职场文书
HTTP中的Content-type详解
2022/01/18 HTML / CSS