`

jquery parent和parents得区别

阅读更多
先说一下parent和parents的区别
从字面上不难看出
parent是指取得一个包含着所有匹配元素的唯一父元素的元素集合。
parents则是取得一个包含着所有匹配元素的祖先元素的元素集合(不包含根元素)。可以通过一个可选的表达式进行筛选。
可以看出parent的取值很明确,就是当前元素的父元素;parents则是当前元素的祖先元素。下面列出例子说明:
<div id='div1'>
<div id='div2'><p></p></div>
<div id='div3' class='a'><p></p></div>
<div id='div4'><p></p></div>
</div>
$('p').parent()取到的是div2,div3,div4
$('p').parent('.a')取到的是div3
$('p').parent().parent()取到的是div1,这点比较奇特;不过Jquery对象本身的特点决定了这是可行的。
$('p').parents()取到的是div1,div2,div3,div4
$('p').parents('.a')取到的是div3
parent(exp)用法:取得一个包含着所有匹配元素的唯一父元素的元素集合。
<script src="jquery-1.2.6.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#btn1").click(function(){
alert($(this).parent().next().html());
});
});
</script>
</head>
<body>
<table>
<tr>
      <td><input id="btn1"  class="btn" type="button"  value="test" /></td>
      <td>some text</td>
</tr>
</table>
....
其中:
this.parent()是input前面的td
this.parent().parent()获取的是tr
this.parent().parent().parent()获取的是table
this.parent().next()获取的是td相临的td
例子中:
<div><p>Hello</p><p>Hello</p></div>
$("p").parent() 得到的是:<div><p>Hello</p><p>Hello</p></div>对象,因为p标签的父标签是div.
分享到:
评论

相关推荐

    jquery parent和parents的区别分析

    parents则是当前元素的祖先元素。下面列出例子说明: 代码如下:’div1′&gt;’div2′&gt;&lt;p&gt;&lt;/p&gt;&lt;/div&gt;&lt;div id=’div3′ class=’a’&gt;&lt;p&gt;&lt;/p&gt;&lt;/div&gt;&lt;div id=’div4′&gt;&lt;p&gt;&lt;/p&gt;&lt;/div&gt;&lt;/div&gt;$(‘p’).parent()取到的是div2,...

    jQuery中parents()和parent()的区别分析

    本文实例分析了jQuery中parents()和parent()的区别,分享给大家供大家参考。具体分析如下: 其实在jQuery中,函数或者选择器的概念都是很容易理解的,只要对API手册有足够的熟练就能够很容易分辨,标题中的函数其实...

    JQuery.closest(),parent(),parents()寻找父结点

    在50个必备的实用jQuery代码段看到关于closest()方法的介绍,考虑到开发过程中经常有找爹的需求,以前用的都是parent()/parents()方法(还经常找不到!),所以就此研究对比一下!

    jQuery中closest和parents的区别分析

    jQuery中closest和parents从表现上来看都是说查找上线元素的一些内容了,但如果说仔细可能各位不懂,下面我们一起来看看closest和parents区别。 1.父级 parent()——唯一父级元素,可能是0个或1个元素。 2.祖先 ...

    jquery遍历之parent()和parents()的区别及parentsUntil()方法详解

    .parent(selector) 获得当前匹配元素集合中每个元素的父元素,由选择器筛选(可选)。....parents() 和 .parent() 方法类似,不同的是后者沿 DOM 树向上遍历单一层级。 这两个方法都可以接受可选的选择器表达式,与

    jQuery向上遍历DOM树之parents(),parent(),closest()之间的区别

    在这个sprint中,因为要写前端UI,所以用到了jQuery,但是jQuery在向上遍历DOM树的API中,有parents()、 parent()、closest()这几个,一直不太清楚它们具体的区别,所以狠下心好好读了一下jQuery的API文档,并把区别...

    jQuery 1.4.1 中文参考

    5.2.9 parents([expr]) 84 5.2.10 parentsUntil([expr]) 85 5.2.11 prev([expr]) 86 5.2.12 prevAll([expr]) 86 5.2.13 prevUntil([expr]) 87 5.2.14 siblings([expr]) 88 5.3 串联 88 5.3.1 add(expr, [context]) ...

    JQuery新版中文手册

    JQuery开发手册 jQuery 核心函数 jQuery([sel,[context]]) jQuery(html,[ownerDoc]) jQuery(callback) jQuery.holdReady(hold)1.6+ jQuery 对象访问 each(callback) size() length selector context get...

    jQuery 遍历 – 祖先

    jQuery parent() 方法 parent() 方法返回被选元素的直接父元素。 该方法只会向上一级对 DOM 树进行遍历。 下面的例子返回每个 元素的直接父元素: 实例 $(document).ready(function(){ $("span").parent(); }); ...

    jQuery 1.5 API 中文版

    $.jQuery( selector [, context] ), .jQuery( element ), .jQuery( elementArray ), .jQuery( jQueryObject ), .jQuery( ) $.jQuery( html [, ownerDocument] ), .jQuery( html, props ) $.jQuery( fn ) jQuery ...

    jQuery中parents()的使用说明

    今天遇到一个有意思的问题,jquery有两个函数parent()和parents().通过这两个函数可以找到一个对象的父对象,又称作jquery的选择器。

    jQuery遍历DOM元素与节点方法详解

    本文实例讲述了jQuery遍历DOM元素与节点方法。分享给大家供大家参考,具体如下: 一、向上遍历–祖先元素...备注:parent与parents的区别,parent返回直接父节点,parents返回所有的祖先节点,另外$(“html”).parent()

    jQuery详细教程

    jQuery 隐藏和显示 通过 hide() 和 show() 两个函数,jQuery 支持对 HTML 元素的隐藏和显示: 实例 $("#hide").click(function(){ $("p").hide(); }); $("#show").click(function(){ $("p").show(); }); 亲自试一试 ...

Global site tag (gtag.js) - Google Analytics