jquery遍历dom的父级元素、子级元素和同级元素的方法总结

《jquery遍历dom的父级元素、子级元素和同级元素的方法总结》由会员上传分享，免费在线阅读，更多相关内容在学术论文-天天文库。

1、jQuery遍历DOM的父级元素、子级元素和同级元素的方法总结借助jQuery我们可以轻松地堆DOM元素进行向上、向下遍历以及同级的遍历，本文我们即来整理jQuery遍历DOM的父级元素、子级元素和同级元素的方法总结：如下图，显示了HTML中的结构树，通过JQuery遍历您能够从被选(当前的)元素开始，轻松地在家族树中向上移动(祖先)，向下移动(子孙)，水平移动(同胞)。这种移动被称为对DOM进行遍历。遍历-父级(祖先)向上遍历DOM数。通过如下三个方法，我们可以获取父级元素：parent()parents()parentsUntil()1.JQuer

2、yparent()parent()方法返回被选元素的直接父元素。该方法只会向上一级对DOM树进行遍历。It;sectiongt:nbsp;lt;hlgt;文章的lt;spangt;标题It:/spangt;啦1t;/hlgt;nbsp;lt;pgt;文章的内容内容内容内容内容内容lt;/pgt;nbsp;It;pgt;结尾部分It;/pgt;It;/sectiongt;$(document).ready(function(){nbsp;//通过parent()函数，可获取当前元素的直接父级元素nbsp;varelem=$(’span’).parent(

3、);nbsp;console.log(elem):});1.JQueryparents()parents()方法返回被选元素的所有父元素。It;sectiongt;nbsp;It;hlgt;文章的It:spangt:标题It;/spangt:啦It;/hlgt;nbsp;lt:pgt;文章的内容内容内容内容内容内容It:/pgt;nbsp;It;pgt;结尾部分It;/pgt;1t;/sectiongt;$(document).ready(function(){nbsp;//通过parent0函数，可获取当前元素的所有父级元素nbsp;varelem=

4、$(’span’).parents();nbsp:console.Iog(elem);nbsp;})；1.JQueryparentsUntil()parentsUntil()方法返回介于两个给定元素之间的所有父级元素lt;sectiongt;nbsp;It;hlgt;文章的It;spangt;标题1t;/spangt;啦It;/hlgt;nbsp;lt;pgt:文章的内容内容内容内容内容内容It;/pgt;nbsp;It:pgt;结尾部分It:/pgt;It;/sectiongt;$(document).ready(function(){nbsp;//

5、获取span在body标签下的所有父级元素nbsp;varelem=$(’span’).parentsUntil(’body’)；nbsp;console.1og(elem);});遍历-子级(后代)向下遍历DOM树。向下遍历可以使用如下两个函数：1.children()2.find()1.JQuerychildren()chiIdrenO方法返回被选元素的所有直接子元素。该方法只会向下一级对DOM树进行遍历。It;sectiongt:nbsp;lt;hlgt;文章的lt;spangt;标题It:/spangt;啦1t;/hlgt;nbsp;lt;pg

6、t;文章的内容内容内容内容内容内容lt;/pgt:nbsp;It;pgt;结尾部分It;/pgt;It;/sectiongt:$(document).ready(function(){nbsp;//获取section标签下的所有直接子元素nbsp;varelem=$(’section’)•chiIdrenO;nbsp;console.log(elem):});2.JQueryfind()find()方法返回被选元素的后代元素，一路向下直到最后一个后代。It;sectiongt;nbsp;It;hlgt;文章的It;spangt;标题It;/spangt

7、;nbsp;lt;pgt;文章的内容内容内容内容内容内容lt;/pgt;nbsp;lt;pgt;结尾部分It;/pgt;It;/sectiongt:$(document).ready(function(){nbsp;//获取section标签下的所有p标签的子元素nbsp;varelem=$(’section’)•find(’p’)；nbsp;console.log(elem);nbsp;//获取section标签下的所有子元素nbsp;varelems=$(’section’)•find(’*’)；nbsp;console.log(elems):})

8、;遍历-同级(兄弟)有以下几个方法：1.sibings()除自身外，遍历同级的所有元素，修改适