Itérer via une table HTML en utilisant jQuery, en convertissant les données dans la table en JSON

Question

Je suis tombé sur un cas où je dois convertir une donnée de table HTML en JSON. Dans ce processus, je dois itérer à travers la table et convertir un par un (ligne) dans un tableau, puis convertir le tableau entier en JSON. Comment puis-je parcourir la table (chaque ligne et colonne)?

Answer 1

Quelque chose comme ça? Récupération du contenu de chaque td dans un tableau myTable[rowIx][tableIx].

var myTable = []; 
$('#myTable tr').each(function (i, tr) { 
    var myTr = []; 

    $('td', tr).each(function(j, td) { 
     myTr.push($(td).html()); 
    }); 

    myTable.push(myTr); 
}); 

Answer 2

Vous devez également convertir le tableau JavaScript (également sur les objets, les chaînes, etc.) en une chaîne sérialisée JSON.

Ajouter à votre page (être ajouté à jQuery bientôt):

<script type="text/javascript" src="http://json.org/json2.js"></script> 

Et sérialisation alors votre tableau:

JSON.stringify(myTable) 

Answer 3

j'ai écrit un plugin pour cela, il a quelques cloches et des sifflets. Check it out à:

http://www.fletchzone.com/post/jQuery-Convert-HTML-Table-to-JSON.aspx

Answer 4

D'abord comme fredrik a souligné que nous devons inclure https://github.com/douglascrockford/JSON-js.

Deuxièmement, nous pouvons utiliser jQuery.fn.map et jQuery.fn.get pour créer un tableau de tableaux (les tr: s) qui contient le contenu jQuery.fn.text des td éléments:

var AoA = $('table tr').map(function(){ 
    return [ 
     $('td',this).map(function(){ 
      return $(this).text(); 
     }).get() 
    ]; 
}).get(); 
var json = JSON.stringify(AoA);