在上一章jQuery教程基础篇之DOM操作-遍历节点-parent()方法,我们讲到了如何获取元素的父元素的集合,有时候我们的需求可能会要查找元素的所有的祖先元素,那么.parents()方法将会满足我们的需求。 .parents([selector])方法返回的是每一个匹配的元素的祖先元素的集合,这些祖先元素中,会包含html这个元素,我们还可以通过传入一个参数来对这些祖先元素进行筛选。 但是在jquery1.4.4 API中文chm文档中却是这样说的: 取得一个包含着所有匹配元素的祖先元素的元素集合(不包含根元素)。可以通过一个可选的表达式进行筛选。 但是我测试过了根元素html的确是可以取到的。 下面来看测试代码: HTML代码: <p> 梦三秋 </p> jquery代码: $("#test").click(function(){ $("span").parents().each(function(index){ var index = index + 1; $("#results").append("span元素的第" + index + "祖先元素为" + this.nodeName + ""); }); }); 测试结果如下图: 通过点击一个按钮,来获取span的所有的祖先元素的tag标签。这里正好和大家解释一下,nodeName这个属性是DOM对象的属性,代表的是DOM对象的html tag。 上面的代码我已经为大家做好了在线DEMO了,请大家点击下面的DEMO按钮去查看结果: 接下来还是上面的HTML代码,只不过在jquery代码中给.parents()方法传入一个参数,让它获取span元素的祖先元素中的div元素。 Jquery代码: $("#test").click(function(){ $("span").parents("div").find("*").each(function(){//找到span的祖先元素中的div元素,然后再找到div元素中的 所有的元素 …
继续阅读
转载于:https://www.cnblogs.com/mengsanqiu/archive/2011/01/28/1947958.html