WEB DEVELOPER SITE
HTMLCSSJAVASCRIPTSQLPHPBOOTSTRAPJQUERYANGULARXML
 

JSON - Introduction


JSON - Evaluates to JavaScript Objects

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

Try it Yourself

JSON Example

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>
Welookups Tutorial (welookups.com)</title>
</head>
<body>
<h2>
JavaScript Create JSON object</h2>
<p>
Website name:<span id="jname">
</span>
<br />
Website address: <span id="jurl">
</span>
<br />
website slogan: <span id="jslogan">
</span>
<br />
</p>
<script>
var JSONObject= { "name":"Welookups Tutorial ", "url":"www.welookups.com", "slogan": "hello world!" }; document.getElementById("jname").innerHTML=JSONObject.name document.getElementById("jurl").innerHTML=JSONObject.url document.getElementById("jslogan").innerHTML=JSONObject.slogan </script>
</body>
</html>

Same as XML

  • JSON is plain text
  • JSON is "self-describing" (human-readable)
  • JSON has a hierarchy (values exist in values)
  • JSON can be parsed by JavaScript
  • JSON data can be transferred using AJAX

What's different from XML

  • No end tag
  • shorter
  • Reading and writing is faster
  • Ability to parse using the built-in JavaScript eval () method
  • Using arrays
  • Do not use reserved words

Why use JSON?

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

Using XML

  • Reading XML documents
  • Using XML DOM to loop through the document
  • Read values and store them in variables

Using JSON

  • Read JSON string
  • Processing JSON strings with eval ()