分类: 前端开发

parent是找当前元素的第一个父节点,不管匹不匹配都不继续往下找

parents是找当前元素的所有父节点 

closest() 是找当前元素的所有父节点 ,直到找到第一个匹配的父节点

1.parent()方法从指定类型的直接父节点开始查找,在"0"中,<a>的直接父节点是<li>所以在这里找不到<ul>父节点。在"2"中先找到了<li>,接着找到<ul>,并将它的背景色设置为yellow。parent()返回一个节点。

2.parents()方法查找方式同parent()方法类似,不同的一点在于,当它找到第一的父节点时并没有停止查找,而是继续查找,最后返回多个父节点,如在"2"中,使得id为menu的ul整个背景色变成了yellow。

3.closest()方法查找时从包含自身的节点找起,它同parents()很类似,不同点就在于它只返回一个节点如在"3"中,实现的功能同1相同。但它使得代码量减小,同"2"相比又只返回单一的一个节点。可见,closest()方法在项目中的使用频率是比较大的。

 

jquery parent() parents() closest()区别的更多相关文章

  1. jQuery_parent() parents() closest()区别

    parent 是找当前元素的第一个父节点,不管匹不匹配都不继续往下找 parents 是找当前元素的所有父节点  closest 是找当前元素的所有父节点 ,直到找到第一个匹配的父节点 <%@ ...

  2. jQuery查找——parent/parents/parentsUntil/closest

    jquery的parent(),parents(),parentsUntil(),closest()都是向上查找父级元素,具体用法不同 parent():取得一个包含着所有匹配元素的唯一父元素的元素集 ...

  3. jQuery中的closest()和parents()的差别

    jQuery中的closest()和parents()的差别 jQuery中closest()和parents()的作用非常类似,都是向上寻找符合选择器条件的元素,可是他们之间有一些细微的差别,官网也 ...

  4. jQuery.extend和jQuery.fn.extend的区别【转】

    解释的很有意思,清晰明了又有趣,转来分享下,哈哈哈 jQuery.extend和jQuery.fn.extend的区别,其实从这两个办法本身也就可以看出来.很多地方说的也不详细.这里详细说说之间的区别 ...

  5. JQUERY与JS的区别

    JQUERY与JS的区别 <style type="text/css"> #aa { width:200px; height:200px; } </style&g ...

  6. jquery deferred done then区别

    jquery deferred done then区别 deferred是jquery 对promise的实现. 以下内容基于jquery 1.8及以上版本 deferred具有then done等属 ...

  7. jQuery和AngularJS的区别

    这篇文章主要介绍了jQuery和AngularJS的区别浅析,本文着重讲解一个熟悉jQuery开的程序员如何应对AngularJS中的一些编程思想的转变,需要的朋友可以参考下   最近一直在研究ang ...

  8. jQuery和Vue的区别

    1.jQuery和Vue的区别 jQuery是使用选择器($)选取DOM对象,对其进行赋值.取值.事件绑定等操作,其实和原生的HTML的区别只在于可以更方便的选取和操作DOM对象,而数据和界面是在一起 ...

  9. 【Python全栈-JavaScript】JavaScript的window.onload()与jQuery 的ready()的区别

    JavaScript的window.onload()与jQuery 的ready()的区别 做web开发时常用Jquery中$(document).ready()和JavaScript中的window ...

随机推荐

  1. POJ 2431Expedition

    Description A group of cows grabbed a truck and ventured on an expedition deep into the jungle. Bein ...

  2. css before,after伪元素妙用

    我们知道,css伪元素包括after,before,first-letter等,通过合理的利用伪元素,我们可以让我们的结构更简洁. 通常写法如p::after{content:' '},其中conte ...

  3. dev checkbox多选

    GridControl如果要支持多选,设置Options->OptionSeletion->MultiSelet为true就ok.

  4. React native 的弹出层(输入)效果

    /*弹出层测试*/ import React,{Component} from 'react'; import { StyleSheet, View, Image, Text, TouchableOp ...

  5. arcmap配置的mxd慢的问题

    http://www.360doc.com/content/13/0220/09/3046928_266688511.shtml

  6. Android底部菜单的实现

    前言:以前制作菜单使用TabHost,但是android 3.0以上就被废弃了,google已经不建议使这个类了.ActionBar也是菜单,不过在头部,算是导航了 ===本文就介绍怎么制作底部菜单= ...

  7. Cenos7 编译安装 Mariadb Nginx PHP Memcache ZendOpcache (实测 笔记 Centos 7.0 + Mariadb 10.0.15 + Nginx 1.6.2 + PHP 5.5.19)

    环境: 系统硬件:vmware vsphere (CPU:2*4核,内存2G,双网卡) 系统版本:CentOS-7.0-1406-x86_64-DVD.iso 安装步骤: 1.准备 1.1 显示系统版 ...

  8. HTML 5 音频(audio)

     audio 元素支持三种音频格式 IE 9 Firefox 3.5 Opera 10.5 Chrome 3.0 Safari 3.0 Ogg Vorbis   √ √ √   MP3 √     √ ...

  9. webservice总结

    webservice xml(DTD,Schema,Stax) SOAP jax-ws (java api xml webservice) 契约优先的开发模式 CXF Rest 异构平台之间的交互(. ...

  10. Spring-Aop入门

    (一)Aop术语定义 1.通知(advice) 通知定义了切面要做什么工作,即调用的方法,同时定义了什么时候做这些工作,即以下五种类型 (1)前置通知(Before) :在目标方法调用之前执行切面方法 ...