小程序开发

jquery获取父元素或父节点的方法

2019-02-11 14:08

jquery获取父元素方法比较多,比如parent(),parents(),closest()这些都能帮你实现查找父元素或节点,下面我们来一一讲解:

先举个例子:

<ul class="parent1"> <li><a href="#" id="item1">jquery获取父节点</a></li> <li><a href="#">jquery获取父元素</a></li> </ul>

我们的目的是通过 id 为 item1 的便签a取到 class 为 parent1 的ul元素,有以下几种方法:

1、parent([expr])

取得一个包含着所有匹配元素的唯一父元素的元素集合。你可以使用可选的表达式来筛选。代码如下:

$('#item1').parent().parent('.parent1');

2、:parent

匹配含有子元素或者文本的元素

代码如下

$('li:parent');

3、parents([expr])

取得一个包含着所有匹配元素的祖先元素的元素集合(不包含根元素)。可以通过一个可选的表达式进行筛选。

代码如下

$('#items').parents('.parent1');

4、closest([expr])

closest会首先检查当前元素是否匹配,如果匹配则直接返回元素本身。如果不匹配则向上查找父元素,一层一层往上,直到找到匹配选择器的元素。如果什么都没找到则返回一个空的jQuery对象。

jquery获取父元素或父节点的方法

closest和parents的主要区别是:前者从当前元素开始匹配寻找,后者从父元素开始匹配寻找;前者逐级向上查找,直到发现匹配的元素后 就停止了,后者一直向上查找直到根元素,然后把这些元素放进一个临时集合中,再用给定的选择器表达式去过滤;前者返回0或1个元素,后者可能包含0 个,1个,或者多个元素。closest对于处理事件委派非常有用。

$('#items1').closest('.parent1');

更多实用jquery代码,请关注思捷智联官方网站http://webbj.cn/
免责声明:我司网站转载此文,不代表本网的观点和立场。不以盈利为目的,如有侵犯公司或个人权益,我司会第一时间删除文章。
小程序开发:webbj.cn北京小程序开发公司,免费获取思维导图!
    相关阅读
  • PHP与ASP.net两大网站开发架构优势对比
    PHP与ASP.net两大网站开发架构优势对比

    PHP与ASP.net两大网站开发架构优势对比 同是目前主流的网站开发架构,PHP与ASP.net各有哪些技术特点呢?他们分别适用于哪些不同的环境中呢? PHP架构优点 PHP比较容易学开发速度比较快,...

  • 网站改版或重建后该如何保持排名
    网站改版或重建后该如何保持排名

    很多时候,我们的网站需要改版或者重建。网站改版或者重建的目的很明确,一是为了提供更好更优质的内容或者服务,给用户带来更好的用户体验度;二是为了优化网站,提升网站在搜...

  • 北京网站建设建站流程
    北京网站建设建站流程

    第一步 客户提出需求 客户提供相关文字及图片资料:同时希望您能够告诉我您喜欢的网站类型及实例; 1.公司简介,各种联系方式; 2.尽量用文字详细说明制作的框架结构; 3.产品或项...

  • 选择seo关键词要避免的大误区
    选择seo关键词要避免的大误区

    在网络营销中,无论是做竞价广告和搜索引擎优化都需要选取关键词,但是在选取关键词中存在了误区,企业往往投放了大量的资金,也带来的了流量,但是没有转化,网络营销学院...

感受专业服务,从来电咨询开始
010-6975976518611391767
在线咨询在线咨询