How can i extract the data? I need the circuitName, date, raceName, round, season and time
var xhr = new XMLHttpRequest;
xhr.onreadystatechange = function(){
if(this.readyState == 4 && this.status == 200){
var json = JSON.parse(xhr.responseText);
var yourData = json.MRData;
document.getElementById('playlist').innerHTML = yourData;
}
};
xhr.open("GET", "http://ergast.com/api/f1/current/next.json", true);
xhr.send();
You can use .map to use the array of races and return an object that folllow your model for each races:
var xhr = new XMLHttpRequest;
xhr.onreadystatechange = function(){
if(this.readyState == 4 && this.status == 200){
const json = JSON.parse(xhr.responseText);
const { MRData: data } = json;
// show the json in HTML
document.getElementById('playlist').innerHTML = JSON.stringify(data, null, 2);
// log circuitName, date, raceName, round, season and time
const { Races: races } = data.RaceTable
const extractList = races.map(({
Circuit: circuit,
date,
raceName,
round,
season,
time,
}) => ({
circuitName: circuit.circuitName,
date,
raceName,
round,
season,
time,
}))
console.log(extractList)
}
};
xhr.open("GET", "http://ergast.com/api/f1/current/next.json", true);
xhr.send();<pre id="playlist"></pre>Note
to render the JSON in HTML, you should stringify the object using JSON.stringify otherwise the Object.prototype.toString method while serialize it to this string: [Object object]
