The best Introducing JSON Tutorial In 2024, In this tutorial you can learn Online examples,JSON examples,In common with XML,And XML differs,Why use JSON?,

Introducing JSON

Online examples

With our editor, you can online edit JavaScript code, and then view the results by clicking on a button:

JSON examples

<!DOCTYPE html>
<html>
<body>
<h2>JSON Object Creation in JavaScript</h2>

<p>
Name: <span id="jname"></span><br />
Age: <span id="jage"></span><br />
Address: <span id="jstreet"></span><br />
Phone: <span id="jphone"></span><br />
</p>

<script>
var JSONObject= {
"name":"John Johnson",
"street":"Oslo West 555",
"age":33,
"phone":"555 1234567"};
document.getElementById("jname").innerHTML=JSONObject.name
document.getElementById("jage").innerHTML=JSONObject.age
document.getElementById("jstreet").innerHTML=JSONObject.street
document.getElementById("jphone").innerHTML=JSONObject.phone
</script>

</body>
</html>



Click the "Try" button to view the online instance.


In common with XML

  • JSON is a text
  • JSON "self-descriptive" (human readable)
  • JSON with a hierarchical structure (value value exists)
  • JSON can be parsed by JavaScript
  • JSON data can be transmitted using AJAX

And XML differs

  • No end tag
  • Shorter
  • Read faster
  • You can use built-in JavaScript eval () method to parse
  • Using arrays
  • Do not use a reserved word

Why use JSON?

For AJAX applications, JSON over XML faster and easier to use:

Use XML

  • Read XML documents
  • Use XML DOM to traverse the document circulation
  • And read the value stored in the variable

Using JSON

  • Read JSON strings
  • Use eval () JSON string processing
Introducing JSON
10/30