js如何实现当前div 排序?

发布网友发布时间：2022-04-29 13:45

共3个回答

热心网友时间：2022-04-22 17:01

<body>
<div data-id="1">1111111</div>
    <div data-id="4">2222222</div>
    <div data-id="3">3333333</div>
    <div data-id="5">4444444</div>
    <div data-id="2">5555555</div>
</body>
<script>
var aDiv = document.getElementsByTagName('div');
var arr = [];
for(var i=0;i<aDiv.length;i++)
{
arr.push(aDiv[i]);  //aDiv是元素的集合，并不是数组，所以不能直接用数组的sort进行排序。
}
arr.sort(function(a,b){return a.getAttribute('data-id') - b.getAttribute('data-id')});
for(var i=0;i<arr.length;i++)
{
document.body.appendChild(arr[i]); //将排好序的元素，重新塞到body里面显示。
}
</script>

思路：给div添加私有属性，通过私有属性排序。

热心网友时间：2022-04-22 18:19

用js即可实现。
其原理是：
取其id值或class值，href值也行。放在数组中，再实现安字母排序。

热心网友时间：2022-04-22 19:54

早期的方案直接重写UL下的所有LI，（资源浪费型）
中期的方案有当前焦点的LI自销，在UL下的首节点又自增（迁徙型）
现期的方案有直接重构LI的CLASS名就行了（有点累赘定位型）