</head>
<body>
<h2>Hello World!</h2>
<div id="result" style="color:red"></div>
<script>
var getJSON = function(url) {
return new Promise(function(resolve, reject) {
var xhr = new XMLHttpRequest();
xhr.open('get', url, true);
xhr.responseType = 'json';
xhr.onload = function() {
var status = xhr.status;
if (status == 200) {
resolve(xhr.response);
} else {
reject(status);
}
};
xhr.send();
});
};
getJSON('http://t.weather.sojson.com/api/weather/city/101030100').then(function(data) {
alert('Your Json result is: ' + data); //you can comment this, i used it to debug
var html = '<ul>';
for (var i = 0; i < data.length; i++) {
html += '<li>' + 'jobID is:'+data.low + ', file path is' +data.filePath + '</li>';
}
html += '</ul>';
document.getElementById('result').innerHTML = html; //display the result in an HTML element
}, function(status) { //error detection....
alert('Something went wrong.');
});