Ahoj světe!

Tato část tutoriálu je o jádru JavaScriptu, o samotném jazyce.

Ke spouštění našich skriptů však potřebujeme pracovní prostředí, a protože je tato kniha online, je dobrou volbou prohlížeč. Zachováme množství příkazů specifických pro prohlížeč (například alert ) na minimum, abyste na nich netrávili čas, pokud se plánujete soustředit na jiné prostředí (jako je Node.js). V další části tutoriálu se zaměříme na JavaScript v prohlížeči.

Nejprve se tedy podívejme, jak připojíme skript k webové stránce. V prostředích na straně serveru (jako je Node.js) můžete skript spustit příkazem jako "node my.js" .

Značka „script“

Programy JavaScript lze vložit téměř kamkoli do dokumentu HTML pomocí <script> tag.

Například:

<!DOCTYPE HTML>
<html>

<body>

 <p>Before the script...</p>

 <script>
 alert( 'Hello, world!' );
 </script>

 <p>...After the script.</p>

</body>

</html>

Příklad můžete spustit kliknutím na tlačítko „Přehrát“ v pravém horním rohu výše uvedeného pole.

<script> tag obsahuje kód JavaScript, který se automaticky spustí, když prohlížeč značku zpracuje.

Moderní značení

<script> tag má několik atributů, které se v dnešní době používají zřídka, ale stále je lze nalézt ve starém kódu:

type atribut:<script type=…>

Starý standard HTML, HTML4, vyžadoval, aby skript měl type . Obvykle to bylo type="text/javascript" . Už to není potřeba. Také moderní standard HTML zcela změnil význam tohoto atributu. Nyní jej lze použít pro moduly JavaScriptu. Ale to je pokročilé téma, o modulech si povíme v jiné části tutoriálu.

language atribut:<script language=…>

Tento atribut měl ukazovat jazyk písma. Tento atribut již nedává smysl, protože JavaScript je výchozí jazyk. Není nutné jej používat.

Komentáře před a za skripty.

V opravdu starých knihách a průvodcích můžete najít komentáře uvnitř <script> tagy, jako je tento:

<script type="text/javascript"><!--
 ...
//--></script>

Tento trik se v moderním JavaScriptu nepoužívá. Tyto komentáře skrývají kód JavaScript ze starých prohlížečů, které neuměly zpracovat <script> štítek. Vzhledem k tomu, že prohlížeče vydané za posledních 15 let tento problém nemají, tento druh komentáře vám může pomoci identifikovat opravdu starý kód.

Externí skripty

Pokud máme mnoho kódu JavaScript, můžeme jej umístit do samostatného souboru.

Soubory skriptů jsou připojeny k HTML s src atribut:

<script src="/path/to/script.js"></script>

Zde /path/to/script.js je absolutní cesta ke skriptu z kořene webu. Lze také zadat relativní cestu z aktuální stránky. Například src="script.js" , stejně jako src="./script.js" , by znamenalo soubor "script.js" v aktuální složce.

Můžeme také poskytnout úplnou adresu URL. Například:

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.js"></script>

Chcete-li připojit několik skriptů, použijte více značek:

<script src="/js/script1.js"></script>
<script src="/js/script2.js"></script>
…
Poznámka:

Zpravidla se do HTML vkládají pouze nejjednodušší skripty. Složitější jsou umístěny v samostatných souborech.

Výhodou samostatného souboru je, že jej prohlížeč stáhne a uloží do své mezipaměti.

Jiné stránky, které odkazují na stejný skript, jej vezmou z mezipaměti, místo aby jej stáhly, takže soubor se ve skutečnosti stáhne pouze jednou.

To snižuje provoz a zrychluje stránky.

Pokud src je nastaven, obsah skriptu je ignorován.

Jeden <script> značka nemůže mít obě src atribut a kód uvnitř.

Toto nebude fungovat:

<script src="file.js">
 alert(1); // the content is ignored, because src is set
</script>

Musíme zvolit buď externí <script src="…"> nebo běžný <script> s kódem.

Výše uvedený příklad lze rozdělit do dvou skriptů, aby fungoval:

<script src="file.js"></script>
<script>
 alert(1);
</script>

Shrnutí

  • Můžeme použít <script> pro přidání kódu JavaScript na stránku.
  • type a language atributy nejsou povinné.
  • Skript v externím souboru lze vložit s <script src="path/to/script.js"></script> .

O skriptech prohlížeče a jejich interakci s webovou stránkou se můžete dozvědět mnohem více. Mějme však na paměti, že tato část tutoriálu je věnována jazyku JavaScript, takže bychom se neměli rozptylovat jeho implementacemi specifickými pro prohlížeč. Prohlížeč budeme používat jako způsob, jak spouštět JavaScript, což je velmi pohodlné pro čtení online, ale pouze jeden z mnoha.