jQuery nextAll() 方法用于返回指定选择器的所有下一个兄弟元素。它是 jQuery 中的内置方法。此方法与 DOM 元素的下一个兄弟元素一起向前遍历。

语法

selector.nextAll( filter ) 
filter: filter是可选参数,它指定了一个选择器表达式,用于缩小对下一个兄弟的搜索范围。为了返回多个兄弟,我们可以用逗号分隔每个表达式。

例子

例1

<!DOCTYPE html>
<html>
<head>
<title> jQuery nextAll() 方法 </title>
<style>
.main * {
	display: block;
	border: 2px solid black;
	padding: 10px;
	margin: 15px;
}
</style>
<script src = "https://code.jquery.com/jquery-3.5.1.min.js"> </script>
<script>
function fun(){
	$(document).ready(function(){
		$("p").nextAll().css({"color": "blue", "border": "3px dashed blue"});
	});
}
</script>
</head>
<body class = "main"> body
<div id = "div1"> div 元素
<p> p 元素1 </p>
<p> p 元素2 </p>
<ul> ul 元素 </ul>
<h2>  h2 </h2>
</div>
<button onclick = "fun()"> 点击看看 </button>
</body>
</html>

例2

<!DOCTYPE html>
<html>
<head>
<style>
.main * { 
  display: block;
  border: 2px solid black;
  padding: 10px;
  margin: 15px;
}
</style>
<script src = "https://code.jquery.com/jquery-3.5.1.min.js"> </script>
<script>
function fun(){
	$(document).ready(function(){
	  $("h2").nextAll("p").css({ "color": "blue", "border": "3px dashed blue"});
	});
}
</script>
</head>

<body class = "main"> body
  <div id = "div1"> div 
  <h2>  h2 </h2>
  <p> p 1 </p>
  <span> span  </span>
  <p> p 2</p>
  <ul> ul  </ul>
  <p> p 3 </p>
</div>
<button onclick = "fun()"> click me </button>
</body>
</html>