昨天接到阿里的电话面试，其中有一道题便是这个。当时这个问题我回答的不好，因为我不明白为什么要问这道题。
今天查阅了相关资料，明白了面试姐姐想考验的是dom操作的最小化。因为我们知道，dom操作的复杂性决定了你网页的效率，dom操作越少，页面会越流畅，用户体验感会更好。明白了考察的知识点，那么思路就很简单了。
思路：获取到父元素下的所有孩子节点后，从后往前遍历循环，整合获取到每个子元素的outerHTML，最后将整合的outerHTML赋值给父元素的innerHTML。
代码如下：
<body> <div class="main clearfix" id="main"> <div id="child1"> <span>I am child1</span> </div> <h2 id="child2">I am sad with no reason</h2> <ul id="child3"> <li>1</li> <li>2</li> <li>3</li> <li>4</li> </ul> </div> <button id="reverse">逆序</button> <script> var btn = document.getElementById("reverse"); var rev = function(){ var par = document.getElementById('main'), childs = par.children, innertext = ''; for(var i = childs.length-1; i >= 0; i--){ innertext += childs[i].outerHTML; } par.innerHTML = innertext; } btn.onclick = rev; </script> </body>
