javascript - 使用 props 过滤标签数组

Question

嘿伙计们，我在这里遇到了一个问题。我将 body 标记中的所有元素选择到一个数组中，如下所示:

var DOMelementsOrder = []; 
var elements = document.querySelectorAll('body > div');

        for (var i = 0; i < elements.length; i++) {
            var element = elements[i];
            DOMelementsOrder.push(element);
            console.log(DOMelementsOrder[i].offsetLeft);
        }

我想要达到的目标是按属性左偏移量对数组中的标签进行排序。

for循环中的控制台返回“40,200,85”。我试图实现的目标是按照 offsetLeft 的顺序对 DOMelementsOrder 中的标签进行排序。

有什么帮助吗？提前致谢。

仅使用纯 JS

编辑:

我尝试过:

function bubbleSort(a, b)
        {
            var swapped;
            do {
                swapped = false;
                for (var i=0; i < a.length-1; i++) {
                    if (a[i].b > a[i+1].b) {
                        var temp = a[i].b;
                        a[i].b = a[i+1].b;
                        a[i+1].b = temp;
                        swapped = true;
                    }
                }
            } while (swapped);
        }

        bubbleSort(DOMelementsOrder, DOMelementsOrder.offsetLeft);
        console.log(DOMelementsOrder);

Answer 1

使用Array.prototype.sort方法并传递一个比较函数来比较每个元素的 offsetLeft 值。

// qSA doesn't return an array, so we have to convert it first
var elements = Array.prototype.slice.call(document.querySelectorAll('body > div'));
// then we can sort
var orderedElements = elements.sort(function(a, b) {
  return a.offsetLeft - b.offsetLeft;
});