jQuery获取父元素的几种方法

文章发布于 2023-06-24

jquery官方提供的几个方法,可以从不同需求来获取父元素。下面有这个三个方法的使用示例。

  • parent() 获取父元素
  • parents() 获取祖先元素
  • parentsUntil() 获取祖先元素,但不包括那个选择器匹配到的元素

示例:

HTML部分代码


<ul  class="tab">
    <li><a href="javascript:;">推荐</a></li>
    <li><a href="javascript:;">新闻</a></li>
    <li><a href="javascript:;">社会</a></li>
</ul>

// 引入jQ
<script src="jquery-3.1.1.min.js"></script>

获取li标签

// 获取a标签的父标签li
$('a').parent() ;
//li li li

//获取a标签的祖父class为`.tab`里的li标签
$('a').parentsUntil('.tab'); 
//li li li

// 获取a标签的所有父元素
$('a').parents()
//li li li ul body html

// 获取.tab的祖父元素
$('a').parents('.tab')  
//ul