Created
September 17, 2015 16:50
-
-
Save deepakkj/326cd8adea7f694e0a8d to your computer and use it in GitHub Desktop.
Display JSON data in HTML
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- Display JSON data in HTML --> | |
<!-- This is an example to show simple JSON data in a HTML page --> | |
<!-- Author: Deepak Kumar Jain --> | |
<!-- Email me at [email protected] --> | |
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta name="description" content="[Display JSON data in HTML]"> | |
<meta charset="utf-8"> | |
<title>JS Bin</title> | |
</head> | |
<body> | |
<p id="test"></p> | |
<script id="jsbin-javascript"> | |
/* Creating a JSON object with JSON data*/ | |
var obj = | |
'{ "name":"deepak","age":"23","height":"5.5ft"}'; | |
/* Parsing the JSON data*/ | |
var text = JSON.parse(obj); | |
/* Displaying the JSON data by linking the #test paragraph tag and the JSON object*/ | |
document.getElementById("test").innerHTML = text.name + "<br>" + text.age + "<br>" + text.height; | |
</script> | |
<script id="jsbin-source-javascript" type="text/javascript">/* Creating a JSON object with JSON data*/ | |
var obj = | |
'{ "name":"deepak","age":"23","height":"5.5ft"}'; | |
/* Parsing the JSON data*/ | |
var text = JSON.parse(obj); | |
/* Displaying the JSON data by linking the #test paragraph tag and the JSON object*/ | |
document.getElementById("test").innerHTML = text.name + "<br>" + text.age + "<br>" + text.height;</script></body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment