我正在制作一个电影院的网站，我希望有一个不同日期的列表。如果您点击日期，则会看到当天播放的电影。
我有这个带有数据的json文件：
"schedule": [
{
"day": "Maandag",
"date": "22/05/2017",
"movies": [
{
"title": "I Am Not Your Negro",
"description": "In deze Belgische coproductie vertrekt Raoul Peck van een onafgewerkte roman van de Afro-Amerikaanse schrijver James Baldwin voor een reis door de zwarte geschiedenis die de Burgerrechtenbeweging uit de jaren zestig verbindt met het huidige #BlackLivesMatter. De tekst, geschreven in 1979, is helaas nog altijd heel actueel en bespreekt een diep geworteld racisme. De film is een treffend betoog op basis van archiefbeelden, filmfragmenten en actuele nieuwsbeelden die aan elkaar gepraat worden door de bezwerende stem van Samuel L. Jackson.",
"img": "negro.jpg",
"room": 1,
"screenings": [
"20:25"
],
"kids":false
},
{
"title": "Lady MacBeth",
"description": "De jonge Katherine leeft Northumberland in 1865. Ze is er gevangene in eigen huis en wordt er door haar sadistische echtgenoot en diens autoritaire vader tot op het bot vernederd. Leven in zo’n liefdeloze wereld moet in deze krachtige kostuumfilm wel tot excessen leiden. Wanneer Katherine een allesverzengende relatie aanknoopt met een knecht gaat het mis. Een indrukwekkende speelfilmdebuut van theater- en operaregisseur William Oldroyd.",
"img": "macbeth.jpg",
"room": 2,
"screenings": [
"20:15"
],
"kids":false
},
{
"title": "Tarde para la Ira",
"description": "Na acht jaar in de gevangenis als gevolg van een misgelopen sieradenroof wil Curro maar één ding: een nieuw leven beginnen met zijn familie. Zijn komst leidt echter tot spanningen bij zijn broer en diens vriendin, die een rustig leventje leiden. Bovendien verandert de ontmoeting met Joseph, een mysterieuze vreemdeling, zijn plannen. Hij komt terecht in een onomkeerbare, donkere reis terug naar het verleden, vol wraak. Deze debuutfilm van acteur Raúl Arévalo won recent 4 Goyas (de Spaanse variant van de Oscar) waaronder die voor Beste Film.",
"room": 3,
"img": "tarde.jpg",
"screenings": [
"20:15"
],
"kids":false
}
]
},
{
"day": "Dinsdag",
"date": "23/05/2017",
"movies": [
{
"title": "Django",
"description": "De virtuoze gitarist Django Reinhardt, geboren in een Henegouws dorp, was een Roma. Op het moment dat hij in Parijs concertzalen laat vollopen, vallen de Duitsers Frankrijk binnen. De film focust op de oorlogsjaren van de virtuoze gitarist en zoomt in op zijn poging om naar Zwitserland te vluchten. De aandacht ligt op het droevige lot van de Roma-zigeuners, een bevolkingsgroep die door de nazi’s vervolgd werden, tijdens die oorlogsjaren. De aanstekelijke muziek wordt vertolkt door het Rosenberg Trio.",
"room": 1,
"img": "django.jpg",
"screenings": [
"20:15"
],
"kids":false
},
{
"title": "March of the Penguins 2",
"description": "In March of The Penguins 2 keert regisseur Luc Jacquet terug met een even verbluffend vervolg, en voert de kijker met behulp van drones en onderwatercamera’s mee naar onherbergzame plekken op Antarctica. Ditmaal volgen we een jonge pinguïn die op het punt staat zijn eerste grote reis te maken, vol gevaar en obstakels. Het vervolgverhaal vertelt de lotsbestemming van één pinguïn, wiens krachtige en mysterieuze instincten hem in staat stellen om te overleven.",
"room": 3,
"img": "march.jpg",
"screenings": [
"20:15"
],
"kids":true
},
{
"title": "Their Finest",
"description": "In deze charmante komedie staan twee scenarioschrijvers centraal. Tijdens WOII krijgen ze de opdracht een fictiefilm te maken die het moreel van de Britten moet opschroeven. Tijdens het schrijversproces krijgen ze voortdurend nieuwe richtlijnen van het ministerie van Oorlog om het script aan te passen. Om uiteindelijk de Amerikanen ook over de streep te trekken om deel te nemen aan de oorlog moeten ze de hoofdrol herschrijven met een Amerikaanse held. Een puike verzameling Britse acteurs zijn de kers op de verrukkelijke taart.",
"room": 3,
"img": "finest.jpg",
"screenings": [
"20:15"
],
"kids":false
}
]
},
{
"day": "Woensdag",
"date": "24/05/2017",
"movies": [
{
"title": "Dries",
"description": "DRIES brengt een intiem en fascinerend portret van de Vlaamse modeontwerper Dries Van Noten wiens stijl wordt gekenmerkt door warme kleuren, exquise prints en rijke borduursels. Als één van de laatste onafhankelijke modeontwerpers bekleedt hij een unieke positie in het modelandschap. Hij staat al 25 jaar aan de top en heel wat van zijn collecties zijn iconisch te noemen. Van Noten zelf is bekend om zijn soberheid en zijn bescheidenheid, je zal hem niet vaak zien op modefeestjes en hij geeft amper interviews. Voor het eerst laat hij een camera toe in zijn professionele en persoonlijke leven; regisseur Reiner Holzemer volgde Dries Van Noten een jaar lang langsheen de creatie van 4 collecties.",
"room": 1,
"img": "dries.jpg",
"screenings": [
"18:00"
],
"kids":false
},
{
"title": "The Sense of an Ending",
"description": "Tony Webster, een gescheiden en pensioneerde man, leidt een teruggetrokken leven. Wanneer zijn verleden hem plotseling lijkt in te halen, is de rust voorbij. Hij wordt gedwongen de confrontatie aan te gaan met de waarheid over zijn eerste liefde en moet de ondraaglijke gevolgen van zijn beslissingen destijds onder ogen zien. Een verfilming naar het boek van Julian Barnes. Ritesh Batra (The Lunchbox) fileert met humor, wijsheid en een feilloos gevoel hoe een onbedachtzame of verkeerd ingeschatte handeling jouw pad voor altijd kan bepalen.",
"room": 2,
"img": "sense.jpg",
"screenings": [
"18:00",
"20:25"
],
"kids":false
},
{
"title": "After the Storm",
"description": "Ryota won ooit een prijs met zijn eerste roman maar verdient nu zijn brood als detective. Zijn gokverslaving heeft hem vervreemd van zijn ex-vrouw en zijn zoon. Na de dood van zijn vader lijken zijn bejaarde moeder en mooie ex-vrouw door te gaan met hun leven. Wanneer ze op een avond allemaal in het flatje van de oude moeder zitten, barst een tyfoon los. Ryota, zijn ex en zijn zoon kunnen niet anders dan daar te blijven om te schuilen. Een zachtmoedig, melancholisch en - verrassend genoeg - ook grappig relaas van een gescheiden man die opnieuw toenadering zoekt tot zijn vervreemde familie. Koreeda (Like Father, Like Son, Nobody Knows, …) kan als geen ander Japanse familierelaties ontrafelen.",
"room": 3,
"img": "storm.jpg",
"screenings": [
"18:00"
],
"kids":false
},
{
"title": "Tarde para la Ira",
"description": "Na acht jaar in de gevangenis als gevolg van een misgelopen sieradenroof wil Curro maar één ding: een nieuw leven beginnen met zijn familie. Zijn komst leidt echter tot spanningen bij zijn broer en diens vriendin, die een rustig leventje leiden. Bovendien verandert de ontmoeting met Joseph, een mysterieuze vreemdeling, zijn plannen. Hij komt terecht in een onomkeerbare, donkere reis terug naar het verleden, vol wraak. Deze debuutfilm van acteur Raúl Arévalo won recent 4 Goyas (de Spaanse variant van de Oscar) waaronder die voor Beste Film.",
"room": 1,
"img": "tarde.jpg",
"screenings": [
"20:15"
],
"kids":false
},
{
"title": "Their Finest",
"description": "In deze charmante komedie staan twee scenarioschrijvers centraal. Tijdens WOII krijgen ze de opdracht een fictiefilm te maken die het moreel van de Britten moet opschroeven. Tijdens het schrijversproces krijgen ze voortdurend nieuwe richtlijnen van het ministerie van Oorlog om het script aan te passen. Om uiteindelijk de Amerikanen ook over de streep te trekken om deel te nemen aan de oorlog moeten ze de hoofdrol herschrijven met een Amerikaanse held. Een puike verzameling Britse acteurs zijn de kers op de verrukkelijke taart.",
"room": 4,
"img": "finest.jpg",
"screenings": [
"20:15"
],
"kids":false
}
]
},
{
"day": "Donderdag",
"date": "25/05/2017",
"movies": [
{
"title": "Dries",
"description": "DRIES brengt een intiem en fascinerend portret van de Vlaamse modeontwerper Dries Van Noten wiens stijl wordt gekenmerkt door warme kleuren, exquise prints en rijke borduursels. Als één van de laatste onafhankelijke modeontwerpers bekleedt hij een unieke positie in het modelandschap. Hij staat al 25 jaar aan de top en heel wat van zijn collecties zijn iconisch te noemen. Van Noten zelf is bekend om zijn soberheid en zijn bescheidenheid, je zal hem niet vaak zien op modefeestjes en hij geeft amper interviews. Voor het eerst laat hij een camera toe in zijn professionele en persoonlijke leven; regisseur Reiner Holzemer volgde Dries Van Noten een jaar lang langsheen de creatie van 4 collecties.",
"room": 1,
"img": "dries.jpg",
"screenings": [
"18:00"
],
"kids":false
},
{
"title": "The Sense of an Ending",
"description": "Tony Webster, een gescheiden en pensioneerde man, leidt een teruggetrokken leven. Wanneer zijn verleden hem plotseling lijkt in te halen, is de rust voorbij. Hij wordt gedwongen de confrontatie aan te gaan met de waarheid over zijn eerste liefde en moet de ondraaglijke gevolgen van zijn beslissingen destijds onder ogen zien. Een verfilming naar het boek van Julian Barnes. Ritesh Batra (The Lunchbox) fileert met humor, wijsheid en een feilloos gevoel hoe een onbedachtzame of verkeerd ingeschatte handeling jouw pad voor altijd kan bepalen.",
"room": 2,
"img": "sense.jpg",
"screenings": [
"18:00",
"20:25"
],
"kids":false
},
{
"title": "March of the Penguins 2",
"description": "In March of The Penguins 2 keert regisseur Luc Jacquet terug met een even verbluffend vervolg, en voert de kijker met behulp van drones en onderwatercamera’s mee naar onherbergzame plekken op Antarctica. Ditmaal volgen we een jonge pinguïn die op het punt staat zijn eerste grote reis te maken, vol gevaar en obstakels. Het vervolgverhaal vertelt de lotsbestemming van één pinguïn, wiens krachtige en mysterieuze instincten hem in staat stellen om te overleven.",
"room": 3,
"img": "march.jpg",
"screenings": [
"18:00",
"20:15"
],
"kids":true
},
{
"title": "Miss Sloane",
"description": "Elizabeth Sloane (Jessica Chastain) is een genadeloze lobbyiste, die in Washington bekend staat om haar intelligentie, connecties en talent om de tegenstander steeds een stap voor te zijn. Ze is tot alles bereid om te winnen en rijgt de successen aan elkaar. Maar dan komt ze tegenover de wapenlobby te staan. Een machtige vijand met schijnbaar eindeloze fondsen en geen scrupules. Een bikkelharde strijd is onvermijdelijk. Miss Sloan is een rasechte politieke thriller met veel knipogen naar de meester der politieke thrillers Alan J. Pakula (The Pelican Brief, The Parallax View). ",
"room": 1,
"img": "sloane.jpg",
"screenings": [
"20:15"
],
"kids":false
}
]
},
{
"day": "Vrijdag",
"date": "26/05/2017",
"movies": [
{
"title": "Django",
"description": "De virtuoze gitarist Django Reinhardt, geboren in een Henegouws dorp, was een Roma. Op het moment dat hij in Parijs concertzalen laat vollopen, vallen de Duitsers Frankrijk binnen. De film focust op de oorlogsjaren van de virtuoze gitarist en zoomt in op zijn poging om naar Zwitserland te vluchten. De aandacht ligt op het droevige lot van de Roma-zigeuners, een bevolkingsgroep die door de nazi’s vervolgd werden, tijdens die oorlogsjaren. De aanstekelijke muziek wordt vertolkt door het Rosenberg Trio.",
"room": 1,
"img": "django.jpg",
"screenings": [
"18:00"
],
"kids":false
},
{
"title": "The Sense of an Ending",
"description": "Tony Webster, een gescheiden en pensioneerde man, leidt een teruggetrokken leven. Wanneer zijn verleden hem plotseling lijkt in te halen, is de rust voorbij. Hij wordt gedwongen de confrontatie aan te gaan met de waarheid over zijn eerste liefde en moet de ondraaglijke gevolgen van zijn beslissingen destijds onder ogen zien. Een verfilming naar het boek van Julian Barnes. Ritesh Batra (The Lunchbox) fileert met humor, wijsheid en een feilloos gevoel hoe een onbedachtzame of verkeerd ingeschatte handeling jouw pad voor altijd kan bepalen.",
"room": 2,
"img": "sense.jpg",
"screenings": [
"18:00",
"20:25"
],
"kids":false
},
{
"title": "Their Finest",
"description": "In deze charmante komedie staan twee scenarioschrijvers centraal. Tijdens WOII krijgen ze de opdracht een fictiefilm te maken die het moreel van de Britten moet opschroeven. Tijdens het schrijversproces krijgen ze voortdurend nieuwe richtlijnen van het ministerie van Oorlog om het script aan te passen. Om uiteindelijk de Amerikanen ook over de streep te trekken om deel te nemen aan de oorlog moeten ze de hoofdrol herschrijven met een Amerikaanse held. Een puike verzameling Britse acteurs zijn de kers op de verrukkelijke taart.",
"room": 3,
"img": "finest.jpg",
"screenings": [
"18:00"
],
"kids":false
},
{
"title": "Tarde para la Ira",
"description": "Na acht jaar in de gevangenis als gevolg van een misgelopen sieradenroof wil Curro maar één ding: een nieuw leven beginnen met zijn familie. Zijn komst leidt echter tot spanningen bij zijn broer en diens vriendin, die een rustig leventje leiden. Bovendien verandert de ontmoeting met Joseph, een mysterieuze vreemdeling, zijn plannen. Hij komt terecht in een onomkeerbare, donkere reis terug naar het verleden, vol wraak. Deze debuutfilm van acteur Raúl Arévalo won recent 4 Goyas (de Spaanse variant van de Oscar) waaronder die voor Beste Film.",
"room": 3,
"img": "tarde.jpg",
"screenings": [
"20:15"
],
"kids":false
},
{
"title": "After the Storm",
"description": "Ryota won ooit een prijs met zijn eerste roman maar verdient nu zijn brood als detective. Zijn gokverslaving heeft hem vervreemd van zijn ex-vrouw en zijn zoon. Na de dood van zijn vader lijken zijn bejaarde moeder en mooie ex-vrouw door te gaan met hun leven. Wanneer ze op een avond allemaal in het flatje van de oude moeder zitten, barst een tyfoon los. Ryota, zijn ex en zijn zoon kunnen niet anders dan daar te blijven om te schuilen. Een zachtmoedig, melancholisch en - verrassend genoeg - ook grappig relaas van een gescheiden man die opnieuw toenadering zoekt tot zijn vervreemde familie. Koreeda (Like Father, Like Son, Nobody Knows, …) kan als geen ander Japanse familierelaties ontrafelen.",
"room": 4,
"img": "storm.jpg",
"screenings": [
"20:15"
],
"kids":false
}
]
},
{
"day": "Zaterdag",
"date": "27/05/2017",
"movies": [
{
"title": "Dries",
"description": "DRIES brengt een intiem en fascinerend portret van de Vlaamse modeontwerper Dries Van Noten wiens stijl wordt gekenmerkt door warme kleuren, exquise prints en rijke borduursels. Als één van de laatste onafhankelijke modeontwerpers bekleedt hij een unieke positie in het modelandschap. Hij staat al 25 jaar aan de top en heel wat van zijn collecties zijn iconisch te noemen. Van Noten zelf is bekend om zijn soberheid en zijn bescheidenheid, je zal hem niet vaak zien op modefeestjes en hij geeft amper interviews. Voor het eerst laat hij een camera toe in zijn professionele en persoonlijke leven; regisseur Reiner Holzemer volgde Dries Van Noten een jaar lang langsheen de creatie van 4 collecties.",
"room": 1,
"img": "dries.jpg",
"screenings": [
"18:00"
],
"kids":false
},
{
"title": "Django",
"description": "De virtuoze gitarist Django Reinhardt, geboren in een Henegouws dorp, was een Roma. Op het moment dat hij in Parijs concertzalen laat vollopen, vallen de Duitsers Frankrijk binnen. De film focust op de oorlogsjaren van de virtuoze gitarist en zoomt in op zijn poging om naar Zwitserland te vluchten. De aandacht ligt op het droevige lot van de Roma-zigeuners, een bevolkingsgroep die door de nazi’s vervolgd werden, tijdens die oorlogsjaren. De aanstekelijke muziek wordt vertolkt door het Rosenberg Trio.",
"room": 2,
"img": "django.jpg",
"screenings": [
"18:00",
"22:30"
],
"kids":false
},
{
"title": "The Sense of an Ending",
"description": "Tony Webster, een gescheiden en pensioneerde man, leidt een teruggetrokken leven. Wanneer zijn verleden hem plotseling lijkt in te halen, is de rust voorbij. Hij wordt gedwongen de confrontatie aan te gaan met de waarheid over zijn eerste liefde en moet de ondraaglijke gevolgen van zijn beslissingen destijds onder ogen zien. Een verfilming naar het boek van Julian Barnes. Ritesh Batra (The Lunchbox) fileert met humor, wijsheid en een feilloos gevoel hoe een onbedachtzame of verkeerd ingeschatte handeling jouw pad voor altijd kan bepalen.",
"room": 3,
"img": "sense.jpg",
"screenings": [
"18:00",
"20:15"
],
"kids":false
},
{
"title": "Miss Sloane",
"description": "Elizabeth Sloane (Jessica Chastain) is een genadeloze lobbyiste, die in Washington bekend staat om haar intelligentie, connecties en talent om de tegenstander steeds een stap voor te zijn. Ze is tot alles bereid om te winnen en rijgt de successen aan elkaar. Maar dan komt ze tegenover de wapenlobby te staan. Een machtige vijand met schijnbaar eindeloze fondsen en geen scrupules. Een bikkelharde strijd is onvermijdelijk. Miss Sloan is een rasechte politieke thriller met veel knipogen naar de meester der politieke thrillers Alan J. Pakula (The Pelican Brief, The Parallax View). ",
"room": 4,
"img": "sloane.jpg",
"screenings": [
"20:15"
],
"kids":false
},
{
"title": "Their Finest",
"description": "In deze charmante komedie staan twee scenarioschrijvers centraal. Tijdens WOII krijgen ze de opdracht een fictiefilm te maken die het moreel van de Britten moet opschroeven. Tijdens het schrijversproces krijgen ze voortdurend nieuwe richtlijnen van het ministerie van Oorlog om het script aan te passen. Om uiteindelijk de Amerikanen ook over de streep te trekken om deel te nemen aan de oorlog moeten ze de hoofdrol herschrijven met een Amerikaanse held. Een puike verzameling Britse acteurs zijn de kers op de verrukkelijke taart.",
"room": 5,
"img": "finest.jpg",
"screenings": [
"20:15"
],
"kids":false
},
{
"title": "Tarde para la Ira",
"description": "Na acht jaar in de gevangenis als gevolg van een misgelopen sieradenroof wil Curro maar één ding: een nieuw leven beginnen met zijn familie. Zijn komst leidt echter tot spanningen bij zijn broer en diens vriendin, die een rustig leventje leiden. Bovendien verandert de ontmoeting met Joseph, een mysterieuze vreemdeling, zijn plannen. Hij komt terecht in een onomkeerbare, donkere reis terug naar het verleden, vol wraak. Deze debuutfilm van acteur Raúl Arévalo won recent 4 Goyas (de Spaanse variant van de Oscar) waaronder die voor Beste Film.",
"room": 1,
"img": "tarde.jpg",
"screenings": [
"22:15"
],
"kids":false
},
{
"title": "After the Storm",
"description": "Ryota won ooit een prijs met zijn eerste roman maar verdient nu zijn brood als detective. Zijn gokverslaving heeft hem vervreemd van zijn ex-vrouw en zijn zoon. Na de dood van zijn vader lijken zijn bejaarde moeder en mooie ex-vrouw door te gaan met hun leven. Wanneer ze op een avond allemaal in het flatje van de oude moeder zitten, barst een tyfoon los. Ryota, zijn ex en zijn zoon kunnen niet anders dan daar te blijven om te schuilen. Een zachtmoedig, melancholisch en - verrassend genoeg - ook grappig relaas van een gescheiden man die opnieuw toenadering zoekt tot zijn vervreemde familie. Koreeda (Like Father, Like Son, Nobody Knows, …) kan als geen ander Japanse familierelaties ontrafelen.",
"room": 3,
"img": "storm.jpg",
"screenings": [
"22:15"
],
"kids":false
}
]
}
]
}
这是我用来显示列表并进行＆＃34;点击＆＃34;的javascript代码。功能工作。
{
const createListItems = schedule => {
const $li = document.createElement(`li`);
$li.textContent = `${schedule.date}`;
document.querySelector(`.days`).appendChild($li);
$li.addEventListener(`click`, handleDayClick);
};
const makeListItems = schedule => {
schedule.forEach(date => {
createListItems(date);
});
};
const parse = schedule => {
makeListItems(schedule);
};
const handleDayClick = ({currentTarget: $li}) => {
loadFilmData($li);
};
const loadFilmData = $li => {
setActiveElement($li);
fetch(`./assets/data/buda.json`).then(r => r.json()).then(data => parse(parseMovieDetail));
}
const setActiveElement = $li => {
const $old = document.querySelector(`.active`);
if ($old) {
$old.classList.remove(`active`);
}
$li.classList.add(`active`);
}
const parseMovieDetail = schedule => {
const $container = document.querySelector(`.movies`);
$container.innerHTML = ``;
schedule.forEach(movie => {
$movieList = document.querySelector(`.movies`);
const $article = document.createElement(`article`);
$article.classList.add(`movie`);
$movieList.appendChild($article);
const $h3 = document.createElement(`h3`);
$h3.textContent = `${schedule.movies.title}`;
$article.appendChild($h3);
const $img = document.createElement(`img`);
$img.setAttribute(`src`, `assets/img/${schedule.movies.img}`);
$img.setAttribute(`width`, 200);
$img.setAttribute(`height`, auto);
$article.appendChild($img);
const $p = document.createElement(`p`);
$p.classList.add(`description`);
$p.textContent = `${schedule.movies.description}`;
$article.appendChild($p);
const $div = document.createElement(`div`);
$div.classList.add(`meta`);
$article.appendChild($div);
const $ul = document.createElement(`ul`);
$ul.classList.add(`screenings`);
$div.classList.add($ul)
const $li = document.createElement(`li`);
$li.textContent = `${schedule.movies.screenings}`;
$ul.classList.add($li);
const $p2 = document.createElement(`p`);
$p2.textContent = `Zaal ${schedule.movies.room}`;
$div.appendChild($p2);
})
};
const init = () => {
const jsonFile = `./assets/data/buda.json`;
fetch(jsonFile).then(r => r.json()).then(data => parse(data.schedule));
};
init();
}
它完美地显示了列表，但是当我按下某个日期时，我在第11行得到了这个错误：
Uncaught (in promise) TypeError: schedule.forEach is not a function
有人知道我在这里做错了什么吗？
答案 0 :(得分：1)
我怀疑问题出在loadFilmData中（但是你没有提供错误堆栈跟踪，所以我无法确定）：
1. const loadFilmData = $li => {
2. setActiveElement($li);
3. fetch(`./assets/data/buda.json`).then(r => r.json()).then(data => parse(parseMovieDetail));
4. }
在第3行注意您正在执行parse(parseMovieDetail)，这意味着您将对parseMovieDetail函数的引用作为parse的参数传递。
我认为你打算做的是用结果调用parseMovieDetail？所以像这样：
const loadFilmData = $li => {
setActiveElement($li);
fetch(`./assets/data/buda.json`)
.then(r => r.json())
.then(data => parseMovieDetail(data));
}