从字面上不难看出parent是指取得一个包含着所有匹配元素的唯一父元素的元素集合。parents则是取得一个包含着所有匹配元素的祖先元素的元素集合(不包含根元素)。可以通过一个可选的表达式进行筛选可以看出parent的取值很明确,就是当前元素的父元素;parents则是当前元素的祖先元素。下面列出例子说明:

   

例1

  HTML代码如下:

 <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

 
例2
  HTML代码如下:
<table>
<tr>
<td><input id="btn1" class="btn" type="button" value="test" /></td>
<td>some text</td>
</tr>
</table>

  JQ代码如下:

$(document).ready(function() {
  $("#btn1").click(function(){
    alert($(this).parent().next().html());
  });
});

其中:
this.parent()是input前面的td
this.parent().parent()获取的是tr
this.parent().parent().parent()获取的是table
this.parents()获取的是td,tr,table

大致可以这样理解,这也是个人的一个看法

jquery parent和parents的区别的更多相关文章

  1. jQuery中.parent和.parents的区别

    .parent(selector) 获得当前匹配元素集合中每个元素的父元素,由选择器筛选(可选). .parents(selector) 获得当前匹配元素集合中每个元素的祖先元素,由选择器筛选(可选) ...

  2. jquery parent()和parents()区别

    parent(exp) 取得一个包含着所有匹配元素的唯一父元素的元素集合. 你可以使用可选的表达式来筛选. 查找段落的父元素中每个类名为selected的父元素. HTML 代码: <div&g ...

  3. jquery遍历之parent()与parents()的区别 及 parentsUntil() 方法

    来自:http://blog.csdn.net/zm2714/article/details/8117746 .parent(selector) 获得当前匹配元素集合中每个元素的父元素,由选择器筛选( ...

  4. jQuery 查找父元素的函数 parent 和 parents 的区别

    函数 描述 parent([expr]) 查找子节点childNode的父节点,不包括祖先节点 parents([expr]) 查找子节点childNode的父节点,包括祖先节点 Talk is ch ...

  5. .parent()和.parents()的区别

    parent的取值很明确,就是当前元素的父元素:parents则是当前元素的祖先元素.下面列出例子说明: 如下: <div id='div1'><div id='div2'>& ...

  6. jquery parent和parents,children和find

    parent返回匹配元素的父元素的元素集合:parents返回匹配元素的祖先元素的元素集合. children返回匹配元素的子元素的元素集合:find返回匹配元素的后代元素的元素集合.

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

    http://www.poluoluo.com/jzxy/201312/253059.html 在这个sprint中,因为要写前端UI,所以用到了jQuery,但是jQuery在向上遍历DOM树的AP ...

  8. 前端开发入门到进阶附录一【JQuery中parent(),parents(),parentsUntil()区别和使用技巧】

    JQuery中parent(),parents(),parentsUntil()区别和使用技巧:https://blog.csdn.net/china1223/article/details/5193 ...

  9. Jquery的parent和parents(找到某一特定的祖先元素)

    关于Jquery的parent和parents parent是指取得一个包含着所有匹配元素的唯一父元素的元素集合.parents则是取得一个包含着所有匹配元素的祖先元素的元素集合(不包含根元素).可以 ...

随机推荐

  1. Cobar-Client 实现策略总结

    1. 数据源 DataSource CobarClient 的 DataSource 分为三层 ICobarDataSourceService: 封装了多个 DataSourceDescriptor, ...

  2. php插入排序

    //php版插入排序 $arr=array('','5','3','7','6','4','8','2');     for($i=2;$i<count($arr);$i++)     {   ...

  3. 20145225《Java程序设计》 第8周学习总结

    20145225<Java程序设计> 第八周学习总结 教材学习内容总结 第十五章 通用API 15.1日志 日志API:使用日志的起点是Logger类,要取得Logger类,必须使用Log ...

  4. 隐藏 input 标签的边框

    css input 如何去掉点击后出现的边框:css文件里加:*:focus { outline: none; } 或 input {outline:none;} 去边框的方法如下 方法1: < ...

  5. Jade之Extends

    Extends jade允许多个jade文件继承一个jade文件. jade: //- layout.jade doctype html html head block title title Def ...

  6. 如何在子线程中使用Toast和更新UI

    因为没一个Looper处理消息循环,所以子线程中无法使用Toast 方法: Looper.prepare(); Toast.makeText(getActivity(),"刷到底啦" ...

  7. STL源码--iterator和traits编程技法

    第一部分 iterator学习 STL iterators定义: 提供一种方法,使之能够依序巡访某个聚合物(容器)所含的各个元素,而又无需暴露该聚合物的内部表达方式. 任何iteartor都应该提供5 ...

  8. Django学习(二)

    一  高亮显示 <script type="text/javascript"> $(document).ready(function () { $("#nav ...

  9. Orchard Platform v1.8 发布

    发布说明: 1. 添加Json格式数据文件支持.2. 彻底删除了Settings, Modules, Themes模块.3. 删除了默认的ContentType,Site和User.4. 支持空库(无 ...

  10. Android 5.x特性概览五

    上节,介绍Material Design 对阴影效果的实现,这节,我们来介绍Android 5.x的着色与裁剪的特性. Android 5.X 在对图像的操作上增加更多的功能,下面来看看 Androi ...