Table of Content

JSON creating object : JS & HTML

Creating JSON Object in JavaScript :

<html>
<body>
<h2>Creating JSON Object in JavaScript</h2>
<p>
Name: <span id="jname"></span><br/>
Age: <span id="jage"></span><br/>
Marks: <span id="jmarks"></span><br/>
Subject: <span id="jsubject"></span><br/>
</p>
<script type="text/javascript">
var JSONObject = {
  "name":"Pritesh",
  "age":22,
  "marks":99,
  "subject":"English"};
document.getElementById("jname").innerHTML=JSONObject.name
document.getElementById("jage").innerHTML=JSONObject.age
document.getElementById("jmarks").innerHTML=JSONObject.marks
document.getElementById("jsubject").innerHTML=JSONObject.subject
</script>
</body>
</html>

Output :

Creating JSON Object in Javascript
Name: Pritesh
Age: 22
Marks: 99
Subject: English

Explanation :

First Step is to Create JSON Object in JavaScript. Syntax to Create JSON Object is -

var JSONObject = {
  "name":"Pritesh",
  "age":22,
  "marks":99,
  "subject":"English"};

Now we are going to set these JSON object values to HTML Elements.

document.getElementById("jname").innerHTML=JSONObject.name
document.getElementById("jage").innerHTML=JSONObject.age
document.getElementById("jmarks").innerHTML=JSONObject.marks
document.getElementById("jsubject").innerHTML=JSONObject.subject

This Syntax is used to Set JSON Value to HTML Element.

Must Read External Articles-

  1. http://www.json.org/js.html
  2. http://www.w3schools.com/json/default.asp