In a real world scenario JSON data is received as HTTPRequest from a web server, this data has to be converted into JavaScript Object in order to be displayed on a web page.
JavaScript eval() function is used to convert JSON text into JSON Object.
The JavaScript Compiler parses JSON text to JavaScript object.
Note that the text must be surrounded by braces to avoid errors.
Nested JSON Object :<html>
<head>
<script type="text/javascript">
function jsonEvalEx() {
//JSON Text
var mySongs = '{"songs":[' +
'{"songName":"Imagine","songArtist":"John Lennon" },' +
'{"songName":"Voodoo Child","songArtist":"Jimi Hendrix" },' +
'{"songName":"Kashmir","songArtist":"Led Zeppelin" }]}';
var javaScriptObj = eval ("(" + mySongs + ")");
var data = "";
data = data + "Song : " + javaScriptObj.songs[0].songName + "<br>";
data = data + "Artist : " + javaScriptObj.songs[0].songArtist + "<br><br>";
data = data + "Song : " + javaScriptObj.songs[1].songName + "<br>";
data = data + "Artist : " + javaScriptObj.songs[1].songArtist + "<br><br>";
data = data + "Song : " + javaScriptObj.songs[2].songName + "<br>";
data = data + "Artist : " + javaScriptObj.songs[2].songArtist + "<br><br>";
document.getElementById("mySongs").innerHTML = data;
}
</script>
</head>
<body onload="jsonEvalEx();">
<div id="mySongs"></div>
</body>
</html>
Output:
Song : Imagine
Artist : John Lennon
Song : Voodoo Child
Artist : Jimi Hendrix
Song : Kashmir
Artist : Led Zeppelin
More Posts related to Json-Tutorial,
- JSON Schema Validator Libraries: JSON Tutorial
- JSON Syntax : JSON Tutorial
- JSON Tutorial: List of Lessons
- JSON Nest Objects Example: JSON Tutorial
- JSON Text to JavaScript Object using eval() Example: JSON Tutorial
- JSON Datatypes : Tutorial
- JSON with PHP Example: JSON Tutorial
- JSON Schema and Hyper-Schema : JSON Tutorial
More Posts:
- Android : DeviceMonitor] Sending Tracking request failed! Error - Android
- Cut, Copy and Paste commands for mac - MacOS
- How to make Text in TextView bold and italic in Android - Android
- Android Parsing Data for android-L failed Unsupported major.minor version 51.0 Error - Android
- Setting Java_Home Environment variable on Windows Operating System - Java
- Share Image to WhatsApp with Caption from your Android App - WhatsApp
- AlertDialog with image using ImageView Example - Android
- SharePoint PowerShell - How to get list item by ID using GetItemById - SharePoint
- How to add border to Android TextView - Android
- Delete Android Studio Projects - Android-Studio
- Submit html form on dropdown menu value selection or change using javascript - JavaScript
- list of jars required for hibernate 4.x.x - Java
- How to Change Text Size for Android ActionBar - Android
- Eclipse : A java Runtime Environment (JRE) or Java Development kit (JDK) must be available - Java
- SharePoint List redirect user after submitting form NewForm.aspx - SharePoint