jquery 获取父节点 html,jq使用parent和parents方法获取父节点

通过选择器一般只能获取指定标识的节点，或者获取子节点。

有些场景下，往往需要根据当前节点找到满足条件的父节点。这个可以通过相应的方法来实现。

1、parent方法

该方法可以获取元素的直接父节点。

我们还是通过例子来说明

test

js代码如下

var obj = $("#aid").parent(); //获取到的是aid元素的直接父节点div元素

alert(obj.html());

可以指定parent方法的参数，如 $("#aid").parent("div") 来检查父节点是否满足特定的条件。

2、parents方法

该方法可以获取元素所有上层节点(直到根节点)的集合。如：

test

js代码

var obj = $("#aid").parents(); //一共获得4个父节点，div>div>body>html

obj.each(function(index,data){

alert($(data).prop("tagName"));

});

可以通过给parents方法加参数来有条件的选择父节点。

如 $("#aid").parents("div") 只返回节点标签为DIV的 上层节点集合。

如 $("#aid").parents(".mydiv")  只返回节点包含样式mydiv 的 上层节点集合。

3、小结

通过上面两个方法，加上各种条件设置，可以获取到各种条件的上层节点。