Kódím.cz
/ Czechitas / Digitální akademie Web / JavaScript 1 / Opakování: FilmBox / Projekt FilmBox
11

Opakování: FilmBox

Na fiktivním webovém projektu takzvaně „ze života“ si procvičíme, co jsme se dosud v JavaScriptu naučili.

Předchozí
Vícestránkové aplikace a lovení chyb
Nemá následující
lekci
ÚvodProjekt FilmBox
4
Seznam filmů

Na stránce se seznamem filmů vypište karty se všemi filmy z pole filmy.

  1. Přejděte v prohlížeči na stránku se seznamem.

  2. Na konci souboru seznam.js pomocí document.querySelector vyhledejte prvek s id seznam-filmu.

  3. Vymažte tomuto prvku jeho vnitřní HTML, aby byl prázdný.

  4. Pomocí cyklu projděte všechny filmy z předpřipraveného pole a pro každý přidejte do prvku #seznam-filmu následující HTML doplněné o patřičné informace (název, ochutnávku, plakát).

    <div class="col">
  <div class="card">
    <img
      src="https://via.placeholder.com/780x520?text=Plak%C3%A1t"
      width="780"
      height="520"
      class="card-img-top"
      alt="plakát"
    />
    <div class="card-body">
      <h5 class="card-title">Název filmu</h5>
      <p class="card-text">Krátký popisek filmu.</p>
      <a href="film.html" class="btn btn-primary">Přehrát</a>
    </div>
  </div>
</div>
řešení

Bonus

Přidejte do pole s filmy nějaký další dle vlastního výběru.

Řešení