如何使用 javascript 对 div 进行排序答案

【问题标题】：How can I sort divs with javascript如何使用 javascript 对 div 进行排序
【发布时间】：2019-05-14 17:58:45
【问题描述】：

我想根据它们的 data-id 按升序对几个 div 进行排序。我该怎么做？

<div class="container" data-id="1000">
  <div id="H1"></div>
  <div id="sub">sub 1</div>
  <div id="sub">sub 2</div>
</div>

<div class="container" data-id="3000">
  <div id="H1"></div>
  <div id="sub"></div>
  <div id="sub"></div>
</div>

<div class="container" data-id="2000">
  <div id="H1"></div>
  <div id="sub"></div>
  <div id="sub"></div>
</div>

【问题讨论】：

更多信息会有所帮助。例如，chapName 变量来自哪里？
每页您不能有任何给定的id 值超过一次。 id 必须始终是唯一的！
另外，container 是 div 元素上的无效属性名称。 这会使您的 HTML 无效。
Ehmm... 'div container' 必须是 div id :-D
Chapname 是我从数据库中获取的变量。像这样：db.each("SELECT DISTINCT chapname FROM Chapters ORDER BY chaporder", function(err,chapters) { if (err) {console.log('ERROR!', err);} else { // create variable let chapname = []; // push callback 'chapters' into variable 'chapname' chapname.push(chapters.chapname); // console.log(row);

标签： javascript node.js sorting electron

【解决方案1】：

不久前我找到了解决问题的方法：

function sortOut() {

    // get the classname chapcontainer
    var classname = document.getElementsByClassName('container');

    // create a variable and put the classes it into an array. 
    var divs = [];

    for (var i = 0; i < classname.length; ++i) {
        divs.push(classname[i]);
    }

    // Sort the divs based on data-id. 
    divs.sort(function(a, b) {
        return +a.getAttribute("data-id") - +b.getAttribute("data-id");
    });
};

divs.sort 可以解决问题。关于这个函数的更多信息可以在这里找到：

https://www.w3schools.com/jsref/jsref_sort.asp

【讨论】：