ล่าสุดการพัฒนาเว็บบทเรียน
 

JSONทำอย่างไร

❮ก่อนหน้า ถัดไปบท❯

ร่วมกันใช้ JSON คือการอ่านข้อมูลจากเว็บเซิร์ฟเวอร์และแสดงข้อมูลในหน้าเว็บ

สำหรับความเรียบง่ายนี้สามารถแสดงให้เห็นโดยใช้สตริงเป็น input (แทนของไฟล์ก)

ตัวอย่าง JSON - วัตถุจากสตริง

สร้างสตริง JavaScript ที่มีไวยากรณ์ JSON:

var text = '{ "employees" : [' +
'{ "firstName":"John" , "lastName":"Doe" },' +
'{ "firstName":"Anna" , "lastName":"Smith" },' +
'{ "firstName":"Peter" , "lastName":"Jones" } ]}';

JSON ไวยากรณ์เป็นส่วนหนึ่งของไวยากรณ์ JavaScript

ฟังก์ชัน JavaScript JSON.parse( text ) สามารถใช้ในการแปลงข้อความ JSON เป็นวัตถุ javascript:

var obj = JSON.parse(text);

ใช้วัตถุ JavaScript ใหม่ในหน้าเว็บของคุณ:

ตัวอย่าง

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML =
obj.employees[1].firstName + " " + obj.employees[1].lastName;
</script>
ลองตัวเอง»

ใช้ eval()

เบราว์เซอร์ที่เก่ากว่าโดยการสนับสนุนสำหรับฟังก์ชัน JavaScript JSON.parse() สามารถใช้ eval() ฟังก์ชั่นการแปลงข้อความ JSON เป็นวัตถุ javascript:

ตัวอย่าง

var obj = eval ("(" + text + ")");
ลองตัวเอง»

eval() ฟังก์ชั่นสามารถรวบรวมและรัน JavaScript ใด ๆ
นี้แสดงให้เห็นถึงปัญหาด้านความปลอดภัยที่อาจเกิดขึ้น พยายามที่จะหลีกเลี่ยงได้

มันเป็นความปลอดภัยในการใช้ parser JSON เพื่อแปลงข้อความ JSON ไปยังวัตถุ JavaScript

ตัวแยกวิเคราะห์ JSON จะรับรู้ข้อความ JSON เท่านั้นและจะไม่รวบรวมสคริปต์

ในเบราว์เซอร์ที่ให้การสนับสนุน JSON พื้นเมือง parsers JSON นอกจากนี้ยังได้เร็วขึ้น

สนับสนุน JSON พื้นเมืองรวมอยู่ในเบราว์เซอร์ที่สำคัญทั้งหมดและใน ECMAScript มาตรฐานล่าสุด (จาวาสคริปต์):

สนับสนุนเว็บเบราเซอร์
  • Firefox 3.5
  • Internet Explorer 8
  • Chrome
  • Opera 10
  • Safari 4

เบราว์เซอร์รุ่นเก่าห้องสมุด JavaScript ที่มีอยู่ใน https://github.com/douglascrockford/JSON-js

รูปแบบ JSON ถูกระบุโดยเดิมที Douglas Crockford


❮ก่อนหน้า ถัดไปบท❯