javascript 实现父节点下子节点的倒序排列

最新推荐文章于 2023-11-08 13:07:56 发布

ccfortaeyeon

最新推荐文章于 2023-11-08 13:07:56 发布

阅读量1.1k

点赞数

分类专栏： javascript 文章标签： javascript dom 阿里面试前端

本文链接：https://blog.csdn.net/ccForTaeyeon/article/details/76732323

版权

本文介绍了在JavaScript中如何实现DOM操作，使得父节点下的子节点按照倒序排列，以此提高页面效率和用户体验。通过获取父元素的所有子节点，从后往前遍历并重新设置innerHTML来实现这一目标。

摘要由CSDN通过智能技术生成

昨天接到阿里的电话面试，其中有一道题便是这个。当时这个问题我回答的不好，因为我不明白为什么要问这道题。

今天查阅了相关资料，明白了面试姐姐想考验的是dom操作的最小化。因为我们知道，dom操作的复杂性决定了你网页的效率，dom操作越少，页面会越流畅，用户体验感会更好。明白了考察的知识点，那么思路就很简单了。

思路：获取到父元素下的所有孩子节点后，从后往前遍历循环，整合获取到每个子元素的outerHTML，最后将整合的outerHTML赋值给父元素的innerHTML。

代码如下：

<body>
    <div class="main clearfix" id="main">
        <div id="child1">
            <span>I am child1</span>
        </div>
        <h2 id="chi

关注

专栏目录