亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全，請及時綁定郵箱和手機立即綁定
已解決430363個問題，去搜搜看，總會有你想問的

排序DOM節點的最簡單方法？

排序DOM節點的最簡單方法？

呼啦一陣風 2019-12-12 10:10:57
如果我有這樣的列表：<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>
查看完整描述

3 回答

?
慕碼人8056858

TA貢獻1803條經驗 獲得超6個贊

盡管使用JS庫可能有一種更簡單的方法，但這是使用香草js的有效解決方案。


var list = document.getElementById('mylist');


var items = list.childNodes;

var itemsArr = [];

for (var i in items) {

    if (items[i].nodeType == 1) { // get rid of the whitespace text nodes

        itemsArr.push(items[i]);

    }

}


itemsArr.sort(function(a, b) {

  return a.innerHTML == b.innerHTML

          ? 0

          : (a.innerHTML > b.innerHTML ? 1 : -1);

});


for (i = 0; i < itemsArr.length; ++i) {

  list.appendChild(itemsArr[i]);

}



查看完整回答
反對 回復 2019-12-13
  • 3 回答
  • 0 關注
  • 242 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

 幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

 公眾號

掃描二維碼
關注慕課網微信公眾號