jquery parent和parents的区别分析

前端技术 2023/09/01 JavaScript
可以看出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

本文地址：https://www.stayed.cn/item/2432

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案