Sortieren Td-Werte für mehrere Tabellen

Question

Ich muss die ersten td Elemente von 3 Tabellen sortieren. Ich muss jQuery verwenden, um es nicht reines Javascript zu tun. Beispiel:

<table> 
    <tr> 
     <td>cx</td> 
     <td>xx</td> 
    </tr> 
</table> 
<table> 
    <tr> 
     <td>bx</td> 
     <td>xx</td> 
    </tr> 
</table> 
<table> 
    <tr> 
     <td>ax</td> 
     <td>xx</td> 
    </tr> 
</table> 

Das Ergebnis Ich mag würde bekommen, ist:

<table> 
    <tr> 
     <td>ax</td> 
     <td>xx</td> 
    </tr> 
</table> 
<table> 
    <tr> 
     <td>bx</td> 
     <td>xx</td> 
    </tr> 
</table> 
<table> 
    <tr> 
     <td>cx</td> 
     <td>xx</td> 
    </tr> 
</table> 

Edit 1: das ist, was ich versuche zu tun: wenn man nur sagen könnte mir, wie die aktuelle td zu erhalten Element Wert wäre es nett für mich

Edit 2: Now Die Werte im Ergebnis ist das gleiche wie vor dem Sortieren. Sorry für meine Fehler

var table = $("table"); 
var currentTableTd; 
$.each(table, function(k, v) { 
    //currentTableTd = v.find("td:first-child"); 
    //window.console.log(currentTableTd); // will log error v.find() is not a function which I understand because var v isn't a Jquery object. 
    //or 
    currentTableTd = $(this).find("td:first-child").text(); 
    window.console.log(currentTableTd); //log undefined 
}) 

Answer 1

könnten Sie sort verwenden, dann ersetzen Sie die html: -

var sorted = $('table').sort(function(a, b) { 
 
    return $('td:first', a).text().localeCompare($('td:first', b).text()); 
 
}).clone(); 
 

 
sorted.each(function(i, e) { 
 
    $('table').eq(i).html($(e).html()); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tr> 
 
    <td>cx</td> 
 
    <td>xx</td> 
 
    </tr> 
 
</table> 
 
<table> 
 
    <tr> 
 
    <td>bx</td> 
 
    <td>xx</td> 
 
    </tr> 
 
</table> 
 
<table> 
 
    <tr> 
 
    <td>ax</td> 
 
    <td>xx</td> 
 
    </tr> 
 
</table>

Answer 2

Schließlich, nachdem er während 24 Stunden an diesem Problem arbeiten Ich habe meine eigene Lösung gefunden. Ich poste es hier. Vielleicht könnte es anderen Menschen helfen.

Besonderer Dank geht an jene Leute, die meine Frage "abgelehnt" haben, ohne mir zu helfen. Sie gaben mir die Willenskraft, meine eigene Lösung zu finden.

var table = $("table"); 
    $.each(table, function (k, v) { 
     var $currentTable = $("table").eq(k); 
     var $tr = $currentTable.find("tr").not(":first"); 
     var $tdAll = $tr.find("td:first"); 
     var textNodes = []; //collecting textNodes of td elements 
     var map = {}; //mapping $tdAll 
     var result = []; //contains sorted td elements to be added to the dom 

     $.each($tdAll, function (k, v) { 
      textNodes.push($(v).text()); 
      map[k] = $(v); 
     }) 
     textNodes.sort(); 
     for (var i = 0; i < textNodes.length; i++) { 
      for (var key in map) { 
       if (textNodes[i] === $(map[key]).text()) 
        result.push($(map[key])); 
      } 
     } 
     //Dom construction 
     $tr.find("td").remove(); 
     for (var i = 0; i < textNodes.length; i++) { 
      $tr.eq(i).find("td:first").before($(result[i])); 
     } 
    })