JS - DOM manipulácia 2

Zdroj
ručne priradené
Pridané

Pozrieť na YouTube →

Preber si túto prednášku so svojou AI

Skopíruj pripravený podklad a vlož ho do ChatGPT, Claude alebo inej AI — bude ťa učiť alebo skúšať len z tejto prednášky.

Otvoriť AI: ChatGPT · Claude · Gemini

Zhrnutie prednášky

Prednáška ukazuje, ako v JavaScripte skúmať a upravovať vlastnosti HTML elementov cez DOM. Funkcia console.dir vypíše všetky vlastnosti objektu, napríklad element input, vrátane value, classList a style. Vlastnosť classList umožňuje zisťovať, pridávať (add) a odstraňovať (remove) CSS triedy, zatiaľ čo style.border umožňuje priamo nastaviť ohraničenie. Na praktickom príklade kalkulačky sa pomocou funkcie isNaN kontroluje, či je vstup číslo. Pri nesprávnej hodnote sa input orámuje na červeno a pri správnej sa štýl vráti do pôvodného stavu. Lepšie riešenie sľubuje ďalšie video.

  • - console.dir vypíše všetky vlastnosti a hodnoty DOM elementu, nielen value.
  • - Vlastnosť value obsahuje text, ktorý používateľ zadal do inputu.
  • - classList umožňuje zistiť zoznam tried a pridávať ich (add) alebo odoberať (remove).
  • - Vlastnosť style dáva prístup k CSS štýlom elementu, napríklad style.border = '1px solid red'.
  • - Funkcia isNaN testuje, či hodnota nie je číslo, a slúži na validáciu vstupu.
  • - Pri nesprávnom vstupe sa input orámuje na červeno, pri správnom sa ohraničenie zruší.
  • - Prezentované riešenie validácie je jednoduché a v ďalšom videu príde lepšie.

Zhrnutie pripravené s pomocou AI z prepisu videa.