购物车
登陆 / 注册
微信扫码登陆

推荐手册

jQuery 教程手册(新) >> jQuery手册
其他教程参考

jQuery next() 方法

jQuery next() 方法
next() 方法返回被选元素的后一个同级元素。
蹊下 蹊下 更新时间:2019-03-02 15:41:42

jQuery next() 方法

定义和用法

next() 方法返回被选元素的后一个同级元素。

同级元素是共享相同父元素的元素。

注意:该方法只返回一个元素。

DOM 树:该方法沿着 DOM 元素的后一个同级元素向前遍历。

相关方法:

nextAll() : 返回被选元素之后的所有同级元素

nextUntil() : 返回两个给定参数之间的每个元素之后的所有同级元素

语法

$(selector).next(filter)
参数描述
filter 可选。规定缩小搜索后一个同级元素范围的选择器表达式。    

实例

<style>
.siblings *{ 
	display: block;
	border: 2px solid lightgrey;
	color: lightgrey;
	padding: 5px;
	margin: 15px;
}
</style>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
	$("li.start").next().css({"color":"red","border":"2px solid red"});
});
</script>
</head>
<body>

<div style="width:500px;" class="siblings">
	<ul>ul (父节点)  
		<li>li (兄弟节点)</li>
		<li>li (兄弟节点)</li>
		<li class="start">li (类名为"start"的兄弟节点)</li>
		<li>li (类名为"start"的li节点的下一个的兄弟节点)</li>
		<li>li (兄弟节点)</li>
	</ul>   
</div>

运行实例 »

点击 "运行实例" 按钮查看在线实例

效果图:

网站导航
标签地图
学习路径
视频教程
开发软件
旗下子站
php中文网
phpstudy
技术文章
文档工具
关于我们
企业合作
人才招聘
联系我们
讲师招募
QQ交流群
QQ官方交流群
微信公众号
微信公众号