jQuery中parent(), parents(), parentsUntil() 3个函数的区别

现象:在试用JQuery的时候遇到元素查找,过程中使用parentsUntil()和next()函数,但是老是得到undefined

原因:在jQuery官方文档中描述的这3个函数都返回jquery对象,实际则不是,parent()函数返回jquery对象,返回的是单个父元素对象,而parents()函数和parentsUntil()函数其中有个s,表明返回的是1个数组,parentsUntil()很逗,返回的是不包括选择器一级的父元素,比如你选择器写1个div,它并不返回包含这个
div的元素集合,而是返回直到它的直接子元素的html标签,并且越靠顶级的元素在这个数组中的索引就越大,并且这2个函数都返回的是DOM对象,不能直接使用jquery提供的方法。

解决方案

1.var sub = parentsUntil("目标DIV");

2.var $targetDIVObj = $(sub[sub.length - 1]).parent();

参考地址详解直通车

代码片段Download Here

时间: 2024-10-11 14:31:39

jQuery中parent(), parents(), parentsUntil() 3个函数的区别的相关文章

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

jquery的parent(),parents(),parentsUntil(),closest()都是向上查找父级元素,具体用法不同 parent():取得一个包含着所有匹配元素的唯一父元素的元素集合. parents():沿 DOM 树向上遍历,直到文档的根元素(<html>)为止,将每个祖先元素添加到一个临时的集合:如果应用了选择器,则会基于该选择器对这个集合进行筛选.返回零个.一个或多个元素. closest():沿 DOM 树向上遍历,直到找到已应用选择器的一个匹配为止.返回零个或一

Jquery中parent()和parents()

一.parent()方法 此方法取得匹配元素集合中每个元素的紧邻父元素,也就是第一级父元素,而不是所有的祖先元素.所取得的父元素集合也可以使用表达式进行筛选. 二.parents()方法 此方法取得一个包含着所有匹配元素的父辈元素的元素集合.所取得的父辈元素集合也可以使用表达式进行筛选 如果给定一个表示 DOM 元素集合的 jQuery 对象,.parents() 方法允许我们在 DOM 树中搜索这些元素的祖先元素,并用从最近的父元素向上的顺序排列的匹配元素构造一个新的 jQuery 对象.元素

jQuery中对AJAX操作的封装函数

jQuery提供了6个简化AJAX操作的函数,每个都可以代替元素AJAX中的四步代码! (1)$('xxx').load()         jQuery对象函数 (2)$.get()                   jQuery全局函数 (3)$.post()                 jQuery全局函数 (4)$.getScript()          jQuery全局函数 (5)$.getJSON()           jQuery全局函数 (6)$.ajax()     

jQuery中的$(window)与$(document)几个用法区别

[window对象]    它是一个顶层对象,而不是另一个对象的属性,即表示浏览器中打开的窗口. 1.属性 defaultStatus 缺省的状态条消息 document 当前显示的文档(该属性本身也是一个对象) frame 窗口里的一个框架((FRAME>)(该属性本身也是一个对象) frames array 列举窗口的框架对象的数组,按照这些对象在文档中出现的顺序列出(该属性本身也是一个对象) history 窗口的历史列表(该属性本身也是一个对象) length 窗口内的框架数 locat

[转载]jQuery中wrap、wrapAll和wrapInner用法以及区别

原文地址:jQuery中wrap.wrapAll和wrapInner用法以及区别作者:伊少君 原文: <ul> <li title='苹果'>苹果</li> <li title='橘子'>橘子</li> <li title='菠萝'>菠萝</li> </ul> 1.$("li").wrap("<div></div>"); 每一个选择器都添加 <

JS下offsetLeft,style.left,以及jQuery中的offset().left,css(&quot;left&quot;)的区别。

JS下offsetLeft,style.left,以及jQuery中的offset().left,css("left")的区别. JS下的offsetLeft和style.left,以及jquery的css("left"),对定位的理解相似,如果父元素中有定位元素,都是相对于上一个定位元素(position不为static)定位. 值得一提的是如果没有已经定位的父元素,那么offsetLeft指向的是文档(document)的左边缘,而style.left与css(

关于jquery中的bind()、live()、delegate()的区别分析浅析

近来在研究JS的时候,小码哥又一次看到jquery中常见的几种绑定事件的方法:bind(),live(),delegate().因此,闲来无事,想把他们几个做一下系统的分析,一遍后面的码农们能够一起分享! 先说好,鄙人也算是JS的初学者,很复杂的模块啥的,也是略懂而已,要是有码神看到,可别Ma我哈!! 那好,下面就直接进入主题了~ 首先,分别介绍一下这三个方法: 1.bind()--$(selector).bind(event,data,function);     event 为必需,规定添加

jQuery中attr()、prop()、data()用法及区别

.attr(),此方法从jq1.0开始一直存在,官方文档写的作用是读/写DOM的attribute值,其实1.6之前有时候是attribute,有时候又是property..prop(),此方法jq1.6引入,读/写DOM的property..data(),此方法在jq1.2.3引入,作用是把任意的值读取/存储到DOM元素对应的jq对象上. 从性能上对比,.prop() > .data() > .attr(),不同浏览器不同版本.data()和.attr()的性能关系有差异,不过.prop()

jquery中的$(&quot;#id&quot;)与document.getElementById(&quot;id&quot;)的区别

以前一直认为jquery中的$("#id")和document.getElementByIdx_x("id")得到的效果是一样的,今天做特效的时候才发现并不是这么一回事,通过测试得到: 1.alert($("#div"))得到的是[object Object] 2.alert(document.getElementById("div"))得到的是[object HTMLDivElement] 3.alert($("#