استخدم JS لقراءة البيانات التي تم إرجاعها من الخادم مع JS في HTML لعرضها
1. صفحة JS.HTML
تحتاج إلى تقديم ملفات jQuery JS
نسخ رمز رمز على النحو التالي:
<!
<html>
<head>
<title> وثيقة جديدة </title>
<meta name = "general" content = "editPlus">
<meta name = "المؤلف" content = "">
<meta name = "الكلمات الرئيسية" content = "">
<meta name = "الوصف" content = "">
<script src = "jquery-1.8.2.min.js"> </script>
<script>
$ (function () {
// $ ("#LoadData").
$ (docume) .Ready (function () {{) {
// استخدم طريقة GetJson لقراءة بيانات JSON ،
// ملاحظة: يمكن أن تكون info.json أنواعًا مختلفة من الملفات ، طالما أن البيانات هي نوع JSON ، يمكنها
$ .getjson ('info.json' ، function (data) {
var html = '' ؛
$. EECH (البيانات ، الدالة (i ، العنصر) {
html+= '<ted>'+item ['name']+'</td>'+
'<td>'+item ['sex']+'</td>'+
'<td>'+item.address+'</td>'+
'<td>'+item ['home']+'</td> </tr>' ؛
}) ؛
$ (#title).
// بعد الطريقة: أدخل المحتوى بعد كل عنصر مطابقة.
}) ؛
}) ؛
}) ؛
// ملاحظة: يمكن أن يكون item.address ، أو يمكن أن يكون ["العنوان"]
// تقارير Firefox "أخطاء القواعد [" في ملف JSON ["، يمكن تحميل البيانات وحدها
// IE Chrome لا يمكن تحميل البيانات
</script>
</head>
<type type = "button" value = "تحميل بيانات" id = "loadData" />
<body>
<table id = "Infotable">
<tr id = "title"> <th> name </h> <th> الجنس </th> <th> العنوان </th> <th> الصفحة الرئيسية </th> </tr>
</table>
</body>
</html>
ملف info.json
نسخ رمز رمز على النحو التالي:
[
{{
"الاسم": "Zhangsan" ،
"الجنس": "رجل" ،
"العنوان": "هانغتشو" ،
"الصفحة الرئيسية": "http://www.zhangsan.com"
} ،
{{
"الاسم": "ليزي" ،
"الجنس": "Wumen" ،
"العنوان": "بكين" ،
"الصفحة الرئيسية": "http: //www.lisi.coms" "
}
]
سيناريو التطبيق:
ضع السجلات المحددة من قاعدة البيانات على الصفحة الثابتة على أساس منتظم. في الوقت الحقيقي.
في هذه المرحلة ، يمكن تحميل محتوى JSON إلى HTML ثابت.
إنها بالفعل مشكلة في الترميز لا يمكن عرضها.
الحل: افتح ملف .json ملفه للاطلاع على تنسيق الترميز التالي.
هناك أيضًا مكان يسهل ارتكاب أخطاء هنا:
اطلب من ملف JSON الإبلاغ عن 405 خطأ ، من الواضح أن المسار صحيح ، ولكن لا يزال يبلغ عن خطأ.
الحل: قم بتعديل طريقة الطلب للحصول على الطلبات: