从字面上不难看出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. Linux命令(1)- grep

    1.grep 功能:查找文件里符合条件的字符串. 语法:grep [-abcEFGhHilLnqrsvVwxy][-A<显示列数>][-B<显示列数>][-C<显示列数& ...

  2. 关于ajax提交表单参数序列化和时间戳转换

    ajax提交form表单, 序列化表单的参数 //var a = $("#addfm").serialize(); //将表单的内容序列化成为一个字符串 var a = $(&qu ...

  3. js抽奖

    http://www.aichengxu.com/view/64369 <!Doctype html><html><head><meta http-equiv ...

  4. bugly使用

    导入: 1.Bugly.framework 2.Security.framework 3.SystemConfiguration.framework 4.libc++.1.dylib 5.libz.1 ...

  5. 数据库的char(n)

    Mysql中的char(n)或者varchar(n) 其中的n就是代表列,不代表字节! varchar(n)其中的n最多是65535 , 应该在创建表的同时,指定表的编码方式为latin1,因为lat ...

  6. LeetCode(93) Restore IP Addresses

    题目 Given a string containing only digits, restore it by returning all possible valid IP address comb ...

  7. CAST和CONVERT差别与联系

    CAST和CONVERT:都是将一种数据类型转换成为另一种数据类型. CAST: CAST ( expression AS data_type [ ( length ) ] ) EG: )) ) as ...

  8. @Html.Partials 加载分布视图传参数

    如何在视图中利用 viewData参数和model参数,示例如下 <body> <div style="background:#ffd800;width:200px;pad ...

  9. MongoDB 3.2 在windows上的安装

    翻译自 https://docs.mongodb.org/master/tutorial/install-mongodb-on-windows/ 在windows上安装 MongoDB 平台支持:从M ...

  10. 2015年9月10-11日,杨学明老师《IPD DRY RUN》专题培训在武汉某上市企业成功举办!

    2015-9-10~11日,杨学明老师为武汉著名的光通信企业某上市公司实施了为期两天的“IPD DRY RUN”,开班前,该公司三个项目团队的负责人先后发言,烽火PMO部门领导和公开研发部网管系统的领 ...