Skip to content

Instantly share code, notes, and snippets.

@abantej
Created April 22, 2018 16:15
Show Gist options
  • Save abantej/2586299f49917871f117a15007e965e3 to your computer and use it in GitHub Desktop.
Save abantej/2586299f49917871f117a15007e965e3 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head>
<title>Json</title>
</head>
<body>
<ul id="people"></ul>
<script>
/*
var person = {
name: "Brad",
age: 35,
address:{
street:"5 main st",
city: "Boston"
},
children:["Brianna", "Nicholas"]
}
//person = JSON.stringify(person);
//person = JSON.parse(person);
var people = [
{
name:"Brad",
age:35
},
{
name:"John",
age:40
},
{
name:"Sara",
age:25
}
];
// console.log(people[1].name);
var output = '';
for (var i = 0; i < people.length;i++) {
//console.log(people[i].name);
output += '<li>'+people[i].name+'</li>'
}
document.getElementById('people').innerHTML = output;
*/
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var response = JSON.parse(xhttp.responseText);
//console.log(response.people);
var people = response.people;
var output = '';
for (var i = 0; i < people.length;i++) {
//console.log(people[i].name);
output += '<li>'+people[i].name+'</li>'
}
document.getElementById('people').innerHTML = output;
}
};
xhttp.open("GET", "people.json", true);
xhttp.send();
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment