نهج jQuery المبسط لتحويل جدول JSON إلى HTML

يمكن أن يكون تحويل صفائف JSON إلى جداول HTML مهمة شاقة، ولكن jQuery يبسط العملية بشكل كبير.

لإنشاء جدول من مصفوفة JSON، استخدم الدالة getJSON() لاسترداد البيانات:

$.getJSON(url , function(data) {

بعد ذلك، قم بإنشاء نص الجدول:

var tbl_body = "";

قم بالتكرار عبر صفوف وأعمدة مصفوفة JSON لإنشاء خلايا الجدول:

$.each(data, function() {
    var tbl_row = "";
    $.each(this, function(k , v) {
        tbl_row  = "<td>" v "</td>";
    });

استبعاد حقول معينة عن طريق إضافة كائن للتحقق من المفاتيح المراد حذفها:

var expected_keys = { key_1 : true, key_2 : true, key_3 : false, key_4 : true };

أضف شرط if للتحقق من المفاتيح المراد استبعادها:

if ( ( k in expected_keys ) && expected_keys[k] ) {
...
}

إلحاق نص الجدول بعنصر HTML المستهدف:

$("#target_table_id tbody").html(tbl_body);

بدلاً من ذلك، لتحسين الأمان، استخدم النسخة الخالية من الحقن أدناه:

$.getJSON(url , function(data) {
    var tbl_body = document.createElement("tbody");
    var odd_even = false;
    $.each(data, function() {
        var tbl_row = tbl_body.insertRow();
        $.each(this, function(k , v) {
            var cell = tbl_row.insertCell();
            cell.appendChild(document.createTextNode(v.toString()));
        });        
    });            
    $("#target_table_id").append(tbl_body);   
});