FINÁLNÍ VÝPRODEJ KREDITŮ na ITnetwork je tady. Využij poslední šanci a získej až 80 % extra kreditů ZDARMA na náš interaktivní e-learning. Zjisti více:
NOVINKA: Kurz kybernetické bezpečnosti s akreditací MŠMT, nyní již od 0 Kč. Staň se žádaným profesionálem. Zjisti více:

Diskuze: Prečo script ktorý funguje v <body> nefunguje ako subor.js?

V předchozím kvízu, Online test znalostí JavaScript, jsme si ověřili nabyté zkušenosti z kurzu.

Aktivity
Avatar
Libor Šimo (libcosenior)
Tvůrce
Avatar
Libor Šimo (libcosenior):5.12.2015 13:03

Toto funguje:

<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>

var answer1 = "It's alright";
var answer2 = "He is called 'Johnny'";
var answer3 = 'He is called "Johnny"';

document.getElementById("demo").innerHTML =
answer1 + "<br>" + answer2 + "<br>" + answer3;

</script>

</body>
</html>

Toto nie:
html

<!DOCTYPE html>

<html lang="sk">
      <head>
            <meta charset="utf-8" />
            <title>JavaScript - samostatný súbor</title>
            <script type="text/javascript" src="script.js"></script>
      </head>

      <body>
        <p id="demo"></p>
      </body>
</html>

script.js

var answer1 = "It's alright";
var answer2 = "He is called 'Johnny'";
var answer3 = 'He is called "Johnny"';

document.getElementById("demo").innerHTML = answer1 + "<br>" + answer2 + "<br>" + answer3;

Vie niekto prečo?

Odpovědět
5.12.2015 13:03
Aj tisícmíľová cesta musí začať jednoduchým krokom.
Avatar
Jan Lupčík
Tvůrce
Avatar
Odpovídá na Libor Šimo (libcosenior)
Jan Lupčík:5.12.2015 13:08

Nejsem si jist, ale mám za to, že ten skript se spustí hned, jak se načte, takže se ani nestihne načíst ten odstavec. Zkus to JS udělat takto:

window.onload = function() {
        var answer1 = "It's alright";
        var answer2 = "He is called 'Johnny'";
        var answer3 = 'He is called "Johnny"';

        document.getElementById("demo").innerHTML = answer1 + "<br>" + answer2 + "<br>" + answer3;
}
Akceptované řešení
+20 Zkušeností
+2,50 Kč
Řešení problému
Nahoru Odpovědět
5.12.2015 13:08
TruckersMP vývojář
Avatar
Neaktivní uživatel
Tvůrce
Avatar
Odpovídá na Libor Šimo (libcosenior)
Neaktivní uživatel:5.12.2015 14:34

Nebo můžeš přidat atribut defer.

Nahoru Odpovědět
5.12.2015 14:34
Neaktivní uživatelský účet
Avatar
Honza Bittner
Tvůrce
Avatar
Odpovídá na Libor Šimo (libcosenior)
Honza Bittner:5.12.2015 14:38

Je to způsobeno tím, že prohlížeč zpracovává dokument (-> vytváří DOM) postupně od shora dolu.

Nahoře narazí na tvůj JS (je úplně jedno, jestli je importován nebo vložen), ten načte a zpracuje jej.

Může se stát, že v okamžiku, kdy se skript zpracovává ještě není DOM vytvořený, nebo není kompletní, proto se nemusí najít žádný element s #demo a tedy se skript "neprovede".

Pokud umístíš JS na spodek stránky, všechno se provede tak, jak má, jelikož je již připraven DOM a skript se má na čem provést.

Dá se tomu samozřejmě zabránit, pokud spustíš skript až po načtení dokumentu, jak psal Jan Lupčík.

Velmi často jsou dotazy typu proč to na lokálu ("u mě v počítači") funguje a na serveru ne. To je dáno tím, že u tebe v počítači je přístup k souborům okamžitý, takže se okamžitě vytvoří DOM a skript najde chtěný element. Na serveru je však situace jiná. Musíš všechny soubory stahovat a pokud stáhneš skript dříve, než HTML, které se ještě musí převést na DOM, skript se prostě neprovede. Dá se tomu zabránit částečně různým cachováním atp., ale to není moc spolehlivé. Nejspolehlivější je použití .onload či umístění všech skriptů na spodek stránky, což doporučuji, protože nikdy nevíš, je skript, který importuješ má tento problém ošetřený. :-)

Nahoru Odpovědět
5.12.2015 14:38
FIT ČVUT alumnus :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://github.com/tenhobi/ama.
Avatar
Libor Šimo (libcosenior)
Tvůrce
Avatar
Odpovídá na Neaktivní uživatel
Libor Šimo (libcosenior):5.12.2015 15:11

Takto?

<script type="text/javascript" src="script.js" defer></script>

Nefunguje to.

Editováno
Nahoru Odpovědět
5.12.2015 15:11
Aj tisícmíľová cesta musí začať jednoduchým krokom.
Avatar
Jurajs
Člen
Avatar
Odpovídá na Libor Šimo (libcosenior)
Jurajs:5.12.2015 15:13 
<script src="script.js" type="text/javascript"></script>

Takhle ne?

 
Nahoru Odpovědět
5.12.2015 15:13
Avatar
Libor Šimo (libcosenior)
Tvůrce
Avatar
Odpovídá na Jurajs
Libor Šimo (libcosenior):5.12.2015 15:15

Pýtal som sa Jirku Gracíka na umiestnenie atribútu defer.

Nahoru Odpovědět
5.12.2015 15:15
Aj tisícmíľová cesta musí začať jednoduchým krokom.
Avatar
Neaktivní uživatel
Tvůrce
Avatar
Odpovídá na Libor Šimo (libcosenior)
Neaktivní uživatel:7.12.2015 0:26

Ano, takto. Tak pak to může být tím, že to prohlížeč nepodporuje nebo to funguje jinak, než si pamatuji :D

Nahoru Odpovědět
7.12.2015 0:26
Neaktivní uživatelský účet
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 8 zpráv z 8.