How to traverse on JSON (JavaScript object notation) object using JavaScript and how to traverse JSON array using JavaScript?
Below is the simple HTML and JavaScript based program, which have a JSON data object and further that json object have json array. Using JavaScript we will read that json data one by one and generate output for end user, and later that output we will show on html page.
Below is the simple HTML and JavaScript based program, which have a JSON data object and further that json object have json array. Using JavaScript we will read that json data one by one and generate output for end user, and later that output we will show on html page.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | <html> <body> <h2>Create JS Object from JSON String</h2> <p id="output"> </p> <script> var txt = '{"employees":[' + '{"firstName":"Rashid","lastName":"Jorvee" },' + '{"firstName":"Java","lastName":"Script" },' + '{"firstName":"Node","lastName":"JS" }]}'; var jsonData = JSON.parse(txt); var output=""; for (var i = 0; i < jsonData.employees.length; i++) { var counter = jsonData.employees[i]; console.log(counter.firstName); output += "First name: " + counter.firstName + ", Last Name: " +counter.lastName +"<br />"; document.getElementById("output").innerHTML = output; } </script> </body> </html> |
Output:
Create JS Object from JSON String
First name: Rashid, Last Name: Jorvee
First name: Java, Last Name: Script
First name: Node, Last Name: JS
Output on browser console:
console output on browser debugger console