列表元素順序反轉

例子：

1 <ul id="list">
2     <li>1</li>
3     <li>2</li>
4     <li>3</li>
5     <li>4</li>
6 </ul>

頁面效果：

具體方法：

1     var ul = document.getElementById("list");
2     var list = ul.getElementsByTagName("li");
3     var fragment = document.createDocumentFragment();
4     for (var i = list.length - 1; i >= 0; i--) {
5         fragment.appendChild(list[i]);
6     }
7     ul.appendChild(fragment);

執行後的頁面效果：

      createDocumentFragment()方法，則是用了創建一個虛擬的節點對象，或者說，是用來創建文檔碎片節點。它可以包含各種類型的節點，在創建之初是空的。DocumentFragment節點不屬於文檔樹，繼承的parentNode屬性總是null。它有一個很實用的特點，當請求把一個DocumentFragment節點插入文檔樹時，插入的不是DocumentFragment自身，而是它的所有子孫節點。這個特性使得DocumentFragment成了占位符，暫時存放那些一次插入文檔的節點。它還有利於實現文檔的剪切、複製和粘貼操作。 另外，當需要添加多個dom元素時，如果先將這些元素添加到DocumentFragment中，再統一將DocumentFragment添加到頁面，會減少頁面渲染dom的次數，效率會明顯提升。