How can I retrieve data from a JSON file in JavaScript and display flowers and colors in separate unordered lists? I am having trouble adding it.
fetch('dataFiles/midterm.json', {
method: 'GET',
mode: 'no-cors'
})
.then((response) => response.text())
.then((data) => {
//console.log(JSON.parse(data));
//data = response.text();
alert(data);
console.log(data);
document.getElementById("data").innerHTML += "<ul></ul>";
document.getElementById("data").innerHTML += "<ul></ul>";
// Process data
})
.catch ( (err) => { // Handle Error
});
// JSON Data:
{ "inventory": [
{"type": "flower",
"items": [
{ "name" : "Rose", "color" : "Red" },
{ "name" : "Daisy", "color" : "White" }]},
{"type": "color",
"items": [
{ "name" : "Blue", "shade" : "Sky Blue" },
{ "name" : "Green", "shade" : "Forest Green" }]}
]
}