Question

我正在为我的工作场所制作基本的Web应用程序，其中PHP脚本从sql数据库中检索数千行，并将数据放在JavaScript对象中以供我在前端控制。

我已成功完成上述所有工作，没问题。

HTML表格中有几千行（包含结果）。

JavaScript脚本动态地更改各个s的类，具体取决于它们所在的“列”。

我可以检索具有特定类名的所有's，没问题，然后将每个s的innerHTML存储在一个数组中，然后对它进行排序，但是我怎样才能删除它们所在的行该表，相对于s innerHTML对行进行排序，然后将行放回表中？

同样，我知道如何检索相关的数据，对数据进行排序，同时还要排序应该放置行的位置（使用另一个数组） - 但如何使用此数组，行'NEW'位置，实际上将它应用于表格？

我想用JavaScript完成所有这些 - 我宁愿不使用JQuery。如果从其父元素中删除元素 - 被删除的子元素是否会实际销毁，或者我是否可以从表中删除所有行，对它们进行排序，然后将它们放回去？

Answer 1

愚蠢的问题！我只是不够勇敢尝试它。

MYSELF回答。

这是我的功能：

表指向表元素， className 是您希望按行排序的td的类，升序是布尔变量（true / false）：

function sortRows(className,ascending)
{
    var rows = table.getElementsByTagName('tr');
    var elements = [];
    // PLACE ROW ELEMENTS IN AN ARRAY, AS .getElements RETURNED ARRAYS CAN'T BE SORTED
    for(r=2;r<rows.length;r+=1){elements.push(rows[r]);}

    elements.sort(function(a,b){
                                    // SORT FUNCTION
    var x = a.getElementsByClassName("name")[0].innerHTML;  // VALUE IN 'NAME' <td> OF ROW A
    var y = b.getElementsByClassName("name")[0].innerHTML;  // VALUE IN 'NAME' <td> OF ROW B
    var c = a.getElementsByClassName(className)[0];         // VALUE IN className <td> OF ROW A
    var d = b.getElementsByClassName(className)[0];         // VALUE IN className <td> OF ROW B
    if(c){e = c.innerHTML;}                                 // MAKE SURE VALUE EXISTS IN DYNAMIC className CLASSED <td> A           
    if(d){f = d.innerHTML;}                                 // MAKE SURE VALUE EXISTS IN DYNAMIC className CLASSED <td> B           

    if(isNaN(e)+isNaN(f))                                   // CHECK IF EITHER THE FIRST OR SECOND DYNAMIC VALUES ARE TEXT - IF SO, SORT ALPHABETICALLY
    {
        e=e.toLowerCase();
        f=f.toLowerCase();
        if(ascending==1){return(([e,f].sort().reverse()[0] == e)*2-1)}else {return(([e,f].sort()[0] == e)*2-1)};    // IF SO, SORT ALPHABETICALLY ascending OR descending
    }
    else if(e==f)                                           // IF VALUES ARE real VALUES, AND BOTH THE SAME, SORT BY 'NAME' <td> OF ROWS A AND B
    {
        return(([x,y].sort().reverse()[0] == x)*2-1);
    }
    else if(ascending){return e-f;}else{return f-e;}        // ELSE, SORT BY VALUES IN DYNAMICALLY RETRIEVED <td> FOR A AND B
    }
    );

                                    // REMOVE ELEMENTS FROM TABLE
    for(e=0;e<elements.length;e+=1)
    {table.removeChild(table.childNodes[2]);}

                                    // PLACE ELEMENTS BACK IN, ORDERED
    for(r=0;r<elements.length;r+=1)
    {table.appendChild(elements[r]);}
}

JavaScript表行 - 删除，按数组排序，放回正确的位置

1 个答案: