Wie format csv zum html Tabelle Zeilen und Spalten mit Javascript

Wie kann ich das folgende Stück von csv-Daten und konvertieren Sie es zu tr 's und td' s, mit javascript?

Jess,Female,04/26/1990,North Central College,Aix,Spring 2012,WebApp,
MC,Female,04/27/1991,Carnegie Mellon University,Aix,Spring 2012,WebApp,
Sharon,Female,04/03/1967,Hobart and William Smith Colleges,Aix,Spring 2012,WebApp,
Nancy,Female,08/15/1989,The New School,Aix,Spring 2011,WebApp,
Jacqueline,Female,03/18/1991,University of South Carolina,Aix,Spring 2011,WebApp,
Sydney,Female,12/11/1990,University of Vermont,Aix,Spring 2011,WebApp,
Kelsey,Female,12/08/1989,University of Vermont,Aix,Spring 2011,WebApp,
Oktavia,Female,11/05/1990,SUNY - Albany,Aix,Spring 2011,WebApp,
Courtney,Female,12/02/1988,Ithaca College,Aix,Spring 2009,WebApp,
Nike,Female,24.2.1989,Appleby College,Aix,Spring 2008,WebApp,
Linda,Female,8/26/1964,Kalamazoo College,Aix,Spring 2009,WebApp,
Allison,Female,12/15/1976,University of San Diego,Aix,Spring 2009,WebApp,
Carmen,Female,02/07/1988,Carnegie Mellon University,Aix,Spring 2008,WebApp,
Nora,Female,10/23/88,Eastern Washington University,Aix,Spring 2009,WebApp,
Jennifer,Female,10/27/79,University of Kansas,Aix,Spring 2009,WebApp,

Gewünschte Tabellenformat für jede der Zeilen in der csv-Daten.

<tr><td>Jess</td> <td>Female<td><td>04/26/1990</td><td>North Central College</td><td>Aix</td><td>Spring 2012</td><td>WebApp</td></tr>
  • In JavaScript? Ist die CSV-abgerufen über Ajax, oder...?
  • Sorry, ja, die JavaScript-und die csv-Daten werden via Ajax. Nur aktualisiert die Frage.
  • Ja, aber wie bekommen Sie die Daten in Javascript?
InformationsquelleAutor Carl Weis | 2013-01-05
  1. 10

    Vorausgesetzt, Sie haben die CSV-Daten in eine variable (egal ob abgerufen via Ajax oder was auch immer) dann können Sie die .split() Methode um ein array von Zeilen und split jede Zeile auf Kommas:

    var data = //your data
var lines = data.split("\n"),
    output = [],
    i;
for (i = 0; i < lines.length; i++)
    output.push("<tr><td>"
                + lines[i].slice(0,-1).split(",").join("</td><td>")
                + "</td></tr>");
output = "<table>" + output.join("") + "</table>";

    (String .slice() ist zu ignorieren, die nachfolgende Komma in jeder Zeile.)

    Demo: http://jsfiddle.net/frvQ2/

    • +1, speziell für output.join("") trick.
    • Wie würde ich es tun das Gegenteil. Nehmen Sie die html -, nur die tr 's und td' s und konvertieren diese ins csv-format? Weil es nicht funktioniert mit den Daten, die ich habe.
    • yourHTML.replace(/<tr>|<td>/g,"").replace(​​​​​​​​​​​​​​​​​​/<\/td>/g,",").replace(/<\/tr>/g,"\n") würde wiederum ein string, der tr-und td-Elemente zurück in das CSV. Oder passen Sie sich den code in meiner Antwort an split auf die tags und begleiten Sie auf Kommas und Zeilenumbrüche...
    • halten Sie erste-Objekt hat keine Methode push
    • ist eine array-Methode. Ist das Objekt ein array ist, wie gezeigt, in meiner Antwort?
    • yup völlig bewusst sein ein array-Prototyp-Methode, aus irgendeinem Grund, wenn ich entfernen Sie die Klammern habe ich Hinzugefügt für die for-Anweisung es nicht zu werfen, dass Fehler
    • Auch ein weiterer Hinweis: Sie müssen nicht hinzufügen, dass ich die vars können Sie es in der for-Schleife, wie dies für(var i = 0;i<lines.length;i++) kein Zwischenspeichern müssen, es sei denn, Ihre Verwendung außerhalb der Verschluss
    • Ich bin mir nicht sicher, was du meinst mit "Zwischenspeichern" - die i variable die Art, wie ich es Tat, hat genau den gleichen Umfang wie die Art und Weise Sie zeigte in Ihrem Kommentar (JS nicht haben block scope für Variablen, die mit var nur Funktions-Bereich, so dass Ihre änderung hätte keine Auswirkung auf die Ausführung).
    • Ich meinte nur, indem er Sie um in den Anwendungsbereich, wenn Sie nur brauchen Sie für die for-Schleife. denke du hast Recht habe gerade ein performance-test, aus irgendeinem Grund dachte ich, es sei besser, denke, es senkt nur den Gültigkeitsbereich der Variablen lookup-da sind weniger Variablen zu filtern, aber es macht wirklich keinen Unterschied
    • es ist die gleichen Umfang so oder so. Die Deklaration in der Schleife wird nicht begrenzen den Umfang der Schleife. (Es wäre in einigen anderen Sprachen, aber nicht in Javascript.)
    • Wenn Sie nicht über abschließende Kommas nach jeder Zeile entfernen .slice(0,-1).

    InformationsquelleAutor nnnnnn
  2. 3

    Wie etwa:

    var data = //your data

data = "<table><tr>" + 
  data.replace(/,\n/g,"<tr>")
      .replace(/,/g, "<td>")
      .replace(/<tr>$/,"") +
  "</table>";
    InformationsquelleAutor Kernel James
Schreibe einen Kommentar