排序DOM节点的最简单方法？

Question

如果我有这样的列表：

<ul id="mylist">

    <li id="list-item1">text 1</li>

    <li id="list-item2">text 2</li>

    <li id="list-item3">text 3</li>

    <li id="list-item4">text 4</li>

</ul>

重新排列DOM节点以我的喜好最简单的方法是什么？（这需要在页面加载时自动发生，列表顺序首选项是从cookie获取的）

例如

<ul id="mylist">

    <li id="list-item3">text 3</li>

    <li id="list-item4">text 4</li>

    <li id="list-item2">text 2</li>

    <li id="list-item1">text 1</li>

</ul>

Answer 1

尽管使用JS库可能有一种更简单的方法，但这是使用香草js的有效解决方案。var list = document.getElementById('mylist');var items = list.childNodes;var itemsArr = [];for (var i in items) {&nbsp; &nbsp; if (items[i].nodeType == 1) { // get rid of the whitespace text nodes&nbsp; &nbsp; &nbsp; &nbsp; itemsArr.push(items[i]);&nbsp; &nbsp; }}itemsArr.sort(function(a, b) {&nbsp; return a.innerHTML == b.innerHTML&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ? 0&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; : (a.innerHTML > b.innerHTML ? 1 : -1);});for (i = 0; i < itemsArr.length; ++i) {&nbsp; list.appendChild(itemsArr[i]);}