Zobrazit stránkuStarší verzeZpětné odkazyNahoru Tato stránka je pouze pro čtení. Můžete si pouze prohlédnout zdrojový kód, ale ne ho měnit. Zeptejte se správce, pokud si myslíte, že něco není v pořádku. ===== Javascript na Duncanu 2022 ===== ==== Kde běží javascript ==== * v prohlížeči ve webové stránce, resp souboru pojmenovaném s příponou ''%%.html%%'' či ''%%.htm%%'' * v prohlížeči v nástrojích pro vývojáře Konzole je skvělá na rychlé pokusy, v [[krouzek:html_sablona|html souboru]] je zase kód uložený a s kontrolovatelným kontextem. === Úkol === * Vytvořte si někde html soubor [[krouzek:html_sablona|obsahem ze šablony]], například pomocí Notepad++. Uložte ho se jménem končícím na ''%%.htm%%'', například ''%%pokusy.htm%%'' Pozor, operační systém vám nejspíš přípony zakrývá - pozor abyste nevytvořili soubor ''%%pokusy.htm.txt%%'' - měl by jinou ikonku a prohlížeč by ho neotevřel. * Otevřete ten html soubor ve druhém okně ve webovém prohlížeči. * Napište něco do toho souboru mezi ''%%<body>%%'' a ''%%</body>%%'' v editoru a uložte * V prohlížeči dejte refresh - obnovte stránku (klávesa f5, ikonka ↻) * Měli byste vidět svůj napsaný text v prohlížeči. ==== HTML, CSS, Javascript ==== Jedná se o tři různé technologie: * HTML tvoří strukturu a významový strom zobrazené stránky * CSS určuje vzhled (design) zobrazené stránky * Javascript umožňuje stránku dynamicky měnit, podle vstupu uživatele nebo třeba výsledku komunikace se serverem Naštěstí je syntaxe těchto technologií na první pohled odlišná. === HTML === <code html> <div class="informace"> <p> Tohle je <a href="http://example.org">příklad</a> (výsek) <strong>html</strong> kódu, který najdete uvnitř těla stránky. </p> </div> </code> === CSS === <code css> body { color: white; background-color: black; } .informace { color: yellow; } </code> === Javascript === <code javascript> document.body.style.backgroundColor = 'green' const promenna = 5 if (promenna < 10) { console.log('Pekne') } </code> duncan.txt Poslední úprava: 2023/11/15 20:54autor: 127.0.0.1