Javascript-harjoitukset 3

Aloita uusi tiedosto, tallenna se kansioon harj nimellä jsharj3.html ja jsharj3.js. Käytä apuna w3schoolin javascript-materiaalia.

1. Ruokalista

Tee taulukko jossa on tämän viikon ruokalista.

Laadi funktio joka tulostaa taulukon sisällön html-sivullesi näkyviin.

Esimerkki:

päiväysruoka
13.3.2022Härkis sweet´n sour (G, VEG, L) Riisi, tumma (G, VEG, L)
14.3.2022Juures-voipapupyörykkä (G, VEG, L) Tomaattinen kastike (G, L) Perunat (G, VEG, L)
15.3.2022Värikäs kasviskeitto (G, L) Täysjyväviipaleet (L) Kikherne-punajuuritahna (G, VEG, L)
16.3.2022Seitankebabkiusaus (L)
17.3.2022Härkispata pomodoro (G, VEG, L) Pasta täysjyvä cappelli (VEG, L) Reissumies (L)

2. Ruuan lisääminen

Lisää toiminto uuden ruuan lisäämiseksi.





3. Ruuan poistaminen

Lisää painike mukaan jokaisen ruuan jälkeen. Nappia painamalla kyseinen ruoka poistettaisiin taulukosta.

4. Henkilöt

Tee lomake jolla voidaan luoda taulukkoon uusi olio henkilö (Person). Henkilöllä on tiedot firstname, lastname, age ja email.

Syötä uusi henkilö









5. Henkilöt taulukossa

Tulosta taulukkoon lisätyt henkilöt sivullesi table-taulukon sisällä.

Lisää taulukkoon myös mahdollisuus poistaa lisätty henkilö.

6. Lisätehtävä

Kokeile w3schools-sivuston HTML + Javascript peliä. Tee tämä tutoriaali omalle sivulleen, linkitä se harjoitussivullesi.