获取HTML元素的所有数据属性顺序

Question

在#content div中，用户可以拖动它们并对它们进行排序。 每个块可以包含许多节点。 在每个块下，是包含“ data-node-id ”属性的are元素。 我想做一个功能，将拖动排序后得到的顺序。 此功能可以通过单击按钮运行（不必每次更改都运行）。

这是我的页面： http : //orbitcoins.website/demos/demo%20-%20json_nodes_diagram/nodes_diagram_serverfile.php

所以说，我的顺序是这样的：

order = {1,2,3,4,5}//block1:{1}, block2:{2}, block3:{3,4,5}

更改第二个和第三个块的顺序之后，运行此函数时，我们将得到以下结果：

new_order = {1,3,4,5,2}//block1:{1}, block2:{3,4,5}, block3:{2}

使用JQuery或JavaScript时没有任何区别。

Answer 1

好吧，@ Andreas在评论中发布了解决方案：

$("[data-node-id]").map(function() { return +this.getAttribute("data-node-id"); }).get()

这个解决方案对我来说似乎很完美！ 它正是我想要的。

信用转到@Andreas。

Answer 2

使用此代码段，您可以按定义的顺序检查所有块，并在执行结束时获取包含的值：

    // all the blocks you have
    $blocks = array(1, 2, 3);

    // all the elements they contain
    $blocks[1] = array(1);
    $blocks[2] = array(2);
    $blocks[3] = array(345);

    // the new block order you will get
    $new_order = array(1, 3, 2);

    // initialize the new blocks order
    $new_blocks = array();

    // for every block of the new order
    foreach ($new_order as $block) {

        // add to the new blocks order the content of that block
        array_push($new_blocks, $blocks[$block]);

    }

    // for each new block obtained
    foreach ($new_blocks as $block) {

        // and for every node inside
        foreach ($block as $item) {

            // print it out
            var_dump($item);

        }

    }

    // new_blocks is the structure you are searching for