Javascript - Extraire le texte d'une page, puis construire un tableau avec elle

Question

J'ai un tableau de données que je veux saisir du texte, coller dans un tableau (et ensuite utiliser avec Google Maps).

Le tableau ressemble à:

<table> 
    <thead> 
    <tr> 
     <th>One</th> 
     <th>Two</th> 
    </tr> 
    </thead> 
    <tr class='bar'> 
    <td class='name'>Bob</td> 
    <td class='number'>12345</td> 
    </tr> 
    <tr class='bar'> 
    <td class='name'>Jane</td> 
    <td class='number'>-55.34</td> 
    </tr> 
</table> 

Je veux saisir le texte à partir des cellules de table et construire un tableau de tout. Quelque chose comme:

var foo = [ 
['Bob', 12345], 
['Jane', -55.34] 
] 

Ce que j'essayé, en utilisant jquery, était:

var foo = []; 
    $('.bar').each(function(){ 
     foo.push($('.name').text(), $('.number').text()); 
    }); 

Mais que, de toute évidence, ne fonctionne pas donner (et je suis sûr que je suis juste en utilisant le sélecteur du mauvais sens):

["BobJane", 12345-55.34] 

alors, comment obtenez-vous le contenu de chaque TD au sein de chaque TR et construire le tableau avec donc j'obtenir le désiré exemple ci-dessus (avec chaque ensemble de données dans sa propre ligne)?

Answer 1

Vous y êtes presque:

var foo = []; 
$('.bar').each(function(){ 
    var self = $(this); 

    foo.push([self.children('.name').text(), self.children('.number').text()]); 
}); 

Vous poussiez déjà deux nouvelles valeurs sur le tableau foo. Le code ci-dessus pousse une valeur (qui est un tableau contenant deux éléments). Vous avez également dû rechercher dans la ligne du tableau en cours pour les name et number corrects, que vous pouvez faire en utilisant children.

Si cela vous aide à comprendre, le code ci-dessus peut être décomposé en:

var foo = []; 
$('.bar').each(function(){ 
    var self = $(this); 

    var row = [self.children('.name').text(), self.children('.number').text()]; 

    foo.push(row); 
}); 

Answer 2

Vous pouvez le faire using .map() pour construire un objet jQuery des valeurs, and .get() pour tirer le tableau hors de celui-ci.

Essayez ceci:

var array = $('.bar').map(function() { 
    var $ch = $(this).children('td'); 
    return [ [ $.text([$ch[0]]), $.text([$ch[1]]) ] ]; 
}).get(); 

Notez que lors du retour d'un tableau à l'intérieur .map(), vous avez besoin de l'envelopper dans un autre tableau.

Answer 3

passe this comme contexte aux sélecteurs à l'intérieur each pour seulement obtenir un nom/numéro à la fois. Assurez-vous également de passer un tableau [] à push fonction, au lieu de deux entrées.

var foo = []; 
$('.bar').each(function() { 
    var name = $('.name' , this).text(); // name from the current .bar 
    var number = $('.number', this).text(); // number from the current .bar 
    foo.push([ name, number ]); // notice [] 
});