Heim > Web-Frontend > js-Tutorial > Hauptteil

Wie konvertiere ich JSON-Arrays mit jQuery in HTML-Tabellen, einschließlich der Möglichkeit, bestimmte Felder auszuschließen?

Barbara Streisand
Freigeben: 2024-10-30 04:53:02
Original
425 Leute haben es durchsucht

How to Convert JSON Arrays into HTML Tables with jQuery, Including the Ability to Exclude Specific Fields?

JSON-Arrays in HTML-Tabellen mit jQuery konvertieren

Die Umwandlung eines Arrays von JSON-Objekten in eine HTML-Tabelle kann mit jQuery effizient durchgeführt werden.

Lösung:

Das bereitgestellte jQuery-Code-Snippet konvertiert ein Array von JSON-Objekten in eine HTML-Tabelle und schließt bestimmte Felder aus:

<pre class="brush:php;toolbar:false">
$.getJSON(url , function(data) {
    var tbl_body = "";
    var odd_even = false;
    $.each(data, function() {
        var tbl_row = "";
        $.each(this, function(k , v) {
            tbl_row += "<td>"+v+"</td>";
        });
        tbl_body += "<tr class=\""+( odd_even ? "odd" : "even")+"\">"+tbl_row+"</tr>";
        odd_even = !odd_even;               
    });
    $("#target_table_id tbody").html(tbl_body);
});
Nach dem Login kopieren

Ausschließen Für bestimmte Schlüssel fügen Sie diese Logik vor der Zeile tbl_row = hinzu:

var expected_keys = { key_1 : true, key_2 : true, key_3 : false, key_4 : true };
if ( ( k in expected_keys ) &amp;&amp; expected_keys[k] ) {
...
}
Nach dem Login kopieren

Alternativ kann ein sichererer und DOM-freundlicherer Ansatz verwendet werden:

<pre class="brush:php;toolbar:false">
$.getJSON(url , function(data) {
    var tbl_body = document.createElement("tbody");
    var odd_even = false;
    $.each(data, function() {
        var tbl_row = tbl_body.insertRow();
        tbl_row.className = odd_even ? "odd" : "even";
        $.each(this, function(k , v) {
            var cell = tbl_row.insertCell();
            cell.appendChild(document.createTextNode(v.toString()));
        });        
        odd_even = !odd_even;               
    });
    $("#target_table_id").append(tbl_body);   //DOM table doesn't have .appendChild
});
Nach dem Login kopieren

Mit diesen Methoden können Sie ganz einfach Konvertieren Sie JSON-Arrays in HTML-Tabellen mit der Flexibilität, unerwünschte Felder auszuschließen.

Das obige ist der detaillierte Inhalt vonWie konvertiere ich JSON-Arrays mit jQuery in HTML-Tabellen, einschließlich der Möglichkeit, bestimmte Felder auszuschließen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!