Řešení úlohy

Co je zde splněno

  • Použití querySelector() pro výběr prvků.

  • Využití classList.toggle("dark") pro přepínání režimu.

  • Změna textu tlačítka podle aktivní třídy.

  • Stylování obou režimů přímo v <style>.

  • Vše v jednom souboru, jak požaduje zadání.

Vylepšení oproti začátečnické verzi

  • Použití šipkové funkce a ternárního operátoru pro zkrácený a přehledný zápis.

  • Přidán plynulý přechod mezi režimy pomocí transition.

  • Styl tlačítka se také mění podle režimu.

  • Celkově modernější a elegantnější zápis vhodný pro praxi.

Poznámky

  • Častou chybou je zapomenout na == true u podmínky nebo na textContent místo innerHTML.

  • Je vhodné přidat mírnou animaci přechodu (např. transition) pro plynulejší efekt – viz pokročilá varianta.