انتقل إلى محتوى الدرس
فقرة فرعية #2 من درس: JSON HTML

HTML Table

في هذا الدرس سوف نتعرف علي طريقة استخدام بيانات ال JSON مع عناصر ال HTML 

1 صفوف تعليمية
جافا سكريبت
2,801 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

في المثال التالي قمنا بأنشاء جدول HTML وملئه بالبيانات المستلمة على هيئة JSON:

Example

HTML
const dbParam = JSON.stringify({table:"customers",limit:20});
const xmlhttp = new XMLHttpRequest();
xmlhttp.onload = function() {
  myObj = JSON.parse(this.responseText);
  let text = "<table border='1'>"
  for (let x in myObj) {
    text += "<tr><td>" + myObj[x].name + "</td></tr>";
  }
  text += "</table>"
  document.getElementById("demo").innerHTML = text;
}
xmlhttp.open("POST", "/files/gethint.php");
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlhttp.send("x=" + dbParam);