jquery常用方法之parent和parents方法

parent ( ) : 获取除被选中元素的直接父元素，也就是它的上一级父元素；

下边是parent小demo，直接看代码：

需求：假设从后台传来的一个数组，我们要把数据渲染到页面，当点击button按钮时，需要把每一个元素相对应的data-id获取到，传给后台；

//下边数组假设就是后台传过来的数据
var arr = [
      {
          name:"xingchen",
          id:1
      },
      {
          name:"xiaochen",
          id:2
      }
];

//数组循环，把数据渲染到页面中去
var str = "";
arr.forEach(function(ele,index){
     str += "<div class='box' data-id=" + ele.id + "><p>" + ele.name + "</p><button>Add</button></div>"
        })
$("body").append(str);

//点击button时，找到父级div，获取到data-id属性的值，push到数组，传给后台，为什么不用prop，我们之前的文章有讲到
var newArr = [];
$("button").click(function(){
     newArr.push( $(this).parent().attr("data-id") );
});

parents ( ) : 获取除被选中元素的所有父元素；

当然parents里边也可以填写参数，意思是获取指定的父级：

如：

<div class="wrapper">
        <div class="box">
            <div class="son"></div>
        </div>
</div>
  <script>
     $(".son").parents(".wrapper");//找到有wrapper类名的div
  </script>