jQuery parentsUntil() 方法是一个内置的 jQuery 方法。它用于搜索指定元素的父元素直到xx元素停止的所有元素。

如果 selector 未提供或不匹配，则 parentsUntil() 方法将返回所有选定的祖先元素，类似于 parents() 方法。

语法

$(selector).parentsUntil(stop,filter)

参数

stop: 这是一个可选参数。它可以是选择器表达式、jQuery 对象或指示在参数 selector 和 stop。

filter: 这也是一个可选参数。它是缩小祖先搜索范围的选择器表达式。如果我们想得到多个祖先，我们必须用逗号分隔表达式。

例子

例1

没有参数，返回所有的父元素。

<!DOCTYPE html>
<html>
<head>
<style>
.main *{ 
  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").parentsUntil().css({ "color": "blue", "border": "3px dashed blue"});
});
}
</script>
</head>
<body class = "main"> body
  <div> div
    <ul> ul 
      <h2>  h2
          <p>  p </p>
      </h2>
    </ul>   
	</div>
<button onclick = "fun()"> 点击看看 </button>
  </body>
</html>

例2

有参数的例子

<!DOCTYPE html>
<html>
<head>
<style>
.main *{ 
  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").parentsUntil("#div1", "div, ul").css({ "border": "3px dashed blue"});
});
}
</script>
</head>
<body class = "main"> body
  <div id = "div1"> div1
    <ul> ul 
	<div id = "div2"> div2 
      <h4>  h4
	  <div id = "div3"> div3
          <p>  p </p>
		  </div>
      </h4>
	  </div>
    </ul>   
	</div>
<button onclick = "fun()"> 点击看看 </button>
  </body>
</html>