Spoznali bomo
- Kako z JavaScritom in HTML DOM dinamično spremenimo elemente in atribute spletne strani
Sestavi spletno stran, ki jo prikazujeta spodnji sliki in video. Stran poimenuj 23vaja-JS-priimek-ime.html. Stran naj bo izdelana v HTML5 in s CSS.
Koda JavaScript
- S klikom na gumb spremeni vsebino prvega odstavka To je preprost odstavek besedila. v Ta odstavek besedila je bil spremenjen s klikom na gumb!
- S klikom na gumb spremeni sliko smesko.jpg v smesko1.jpg
- S klikom na gumb naključno spremeni barvo odstavka besedila v poglavju Spreminjanje CSS
- S klikom na gumb skrije odstavek besedila v poglavju Spreminjanje CSS
- S klikom na gumb prikaže odstavek besedila v poglavju Spreminjanje CSS
- S klikom na besedilo Klikni me! v poglavju DOM dogodki prikaže besedilo Zapelji miško nad sliko avtomobila
- V poglavju DOM dogodki zamenja sliko avto.png s sliko avto1.png, ko nad sliko zapeljemo kazalec miške, ko pa kazalec s slike odmaknemo, pa se zopet pokaže slika avto.png
- Obarva polje za vnos kratkega besedila z barvo coral, ko vanj kliknemo
Slika spletne strani, ko se stran naloži v brskalniku:
Slika spletne strani, ko se izvedejo vsi JavaScripti na strani:
Video spletne strani: