列表元素順序反轉

例子：

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的次數，效率會明顯提高。