ใช้ 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', ฟังก์ชั่น (ข้อมูล) {
var html = '';
$ .Each (ข้อมูล, ฟังก์ชัน (i, item) {
html+= '<ted>'+item ['name']+'</td>'+
'<td>'+รายการ ['เพศ']+'</td>'+
'<td>'+item.address+'</td>'+
'<td>'+รายการ ['home']+'</td> </tr>';
-
$ ('#title')
// หลังจากวิธีการ: แทรกเนื้อหาหลังจากแต่ละองค์ประกอบการจับคู่
-
-
-
// หมายเหตุ: สามารถเป็น item.address หรืออาจเป็น ['ที่อยู่']
// Firefox รายงาน "ข้อผิดพลาดทางไวยากรณ์ [" ในไฟล์ JSON ["สามารถโหลดข้อมูลเพียงอย่างเดียว
// เช่น Chrome ไม่สามารถโหลดข้อมูลได้
</script>
</head>
<อินพุต type = "button" value = "การโหลดข้อมูล" id = "loadData" />>>>
<body>
<table id = "infotable">
<tr id = "title"> <th> ชื่อ </th> <th> เพศ </th> <th> ที่อยู่ </th> <th> หน้าแรก </th> </tr>
</table>
</body>
</html>
file.json ไฟล์
คัดลอกรหัสรหัสดังนี้:
-
-
"ชื่อ": "จางซาน"
"เพศ": "ผู้ชาย",
"ที่อยู่": "Haangzhou",
"บ้าน": "http://www.zhangsan.com"
-
-
"ชื่อ": "Lisi",
"เพศ": "Wumen",
"ที่อยู่": "ปักกิ่ง",
"home": "http: //www.lisi.coms" "
-
-
สถานการณ์แอปพลิเคชัน:
ใส่ระเบียนที่เฉพาะเจาะจงที่อ่านจากฐานข้อมูลบนหน้าคงที่เพื่อแสดงเป็นประจำ ในเวลาจริง
ณ จุดนี้เนื้อหาของ JSON สามารถโหลดไปยัง HTML แบบคงที่
มันเป็นปัญหาการเข้ารหัสที่ไม่สามารถแสดงได้
วิธีแก้ปัญหา: เปิดไฟล์ไฟล์. json เพื่อดูรูปแบบการเข้ารหัสต่อไปนี้
นอกจากนี้ยังมีสถานที่ที่ง่ายต่อการทำผิดพลาดที่นี่:
ขอให้ไฟล์ JSON รายงานข้อผิดพลาด 405 เห็นได้ชัดว่าเส้นทางนั้นถูกต้อง แต่ยังคงรายงานข้อผิดพลาด
วิธีแก้ปัญหา: แก้ไขวิธีการร้องขอเพื่อรับคำขอ: