Skip to content

Instantly share code, notes, and snippets.

@deepakkj

deepakkj/JSON.html

Created September 17, 2015 16:50
Show Gist options
  • Save deepakkj/326cd8adea7f694e0a8d to your computer and use it in GitHub Desktop.
Save deepakkj/326cd8adea7f694e0a8d to your computer and use it in GitHub Desktop.
Download ZIP
Display JSON data in HTML
Raw
JSON.html
<!-- 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 deepakkumarjain21@gmail.com -->
<!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