Výuka JavaScriptu - 1.

Od dnešního dne bude vycházet seriál o JavaScriptu, který je určen všem začínajícím uživatelům kteří mají o tento skriptovací jazyk zájem.
Každý týden vyjde minimálně jeden článek a pokud je budete pilně číst neměl by být pro vás na konci problém psát vlastní skripty. Základ pro pochopení článků je znalost HTML.

Jaký potřebujete software?

Klidně vystačíte i s Poznámkovým blokem, který obsahují všechny verze Windows. Samozřejmě lepší je použít například HomeSite nebo nějaký freewarový program jako PSPad. K prohlížení vytvořených skriptů je zapotřebí ještě nějaký internetový prohlížeč.

Co je JavaScript?

JavaScript je skriptovací jazyk založený na programovacím jazyku JAVA. JavaScript může být spuštěn na straně klienta (client-side) nebo serveru (server-side). V článcích naleznete informace pouze o tvorbě JavaScriptu na straně klienta (client-side), kdy se kód nachází v HTML dokumentu a je realizován v internetovém prohlížeči, tj. kód se přenese spolu s HTML dokumentem z webové stránky a váš prohlížeč ho spustí a vykoná.

Poznámka: JavaScript NENÍ to stejné co JAVA!

Skriptovací jazyk umožňuje přistupovat k různým prvkům webových stránek jako jsou obrázky, formuláře, odkazy a jiné. Tyto prvky můžeme s pomocí JavaScriptu různě měnit a ovlivňovat. JavaScript také dovoluje reagovat na různé události, například kliknutí myši, stisk klávesy a další, což dovoluje spouštět různé akce podle chování uživatele.

V JavaScriptu se dá napsat například skript reagující na události vyvolané myší (pohyb myši, stisk tlačítka, …), kontrolu formuláře i animace. Jak to ho dosáhnout se dozvíte v sérii článků.

JavaScript má i několik omezení, ovšem logických. Například se nedají číst ani zapisovat soubory na uživatelský počítač (ten, kdo si prohlíží vaše stránky). Toto omezení je jasné, pokud si někdo spustí program na svém počítači (client-side skripty jsou vykonávány na straně klienta) musí si být jist, že program (skript) neohrozí bezpečnost počítače.

Které prohlížeče podporují JavaScript?

Netscape jako první zavedl podporu JavaScriptu ve svém prohlížeči Netscape Navigator 2. Microsoft ho následoval a implementoval podporu JavaScriptu do Internet Exploreru 3. Další prohlížeče reagovaly podobně a podporu pro JavaScript implementovaly také. V současnosti znamená příchod každé nové verze prohlížeče aktualizaci a doplnění stávající verze JavaScriptu.

Kompatibilita mezi různými druhy prohlížečů a jejich verzí může způsobovat při návrhu skriptu problémy, proto se zezačátku zaměříme na všeobecné vlastnosti. Později si ukážeme tyto rozdíly a jak si s nimi poradit.

Poznámka: JavaScript není doménou pouze prohlížečů Netscape Navigator a Internet Explorer. Velmi kvalitní podpora JavaScriptu je i v prohlížečích Mozilla a Opera.

Verze JavaScriptu

JavaScript prošel určitým vývojem a to nám přineslo několik verzí:
  • JavaScript 1.0 - Netscape Navigator 2.0
  • JavaScript 1.1 - Netscape Navigator 3.0; Internet Explorer 3.0 (ovšem podpora JavaScriptu V IE nestála za nic)
  • JavaScript 1.2 - Netscape Navigator 4.0-4.05; první verze Internet Exploreru 4.0
  • JavaScript 1.3 - Netscape Navigator 4.06-4.5; pozdější verze Internet Exploreru 4.0 plus Internet Explorer 5.0
  • JavaScript 1.5 - Netscape Navigator 6.0 a vyšší; Internet Explorer 5.5 a vyšší
Microsoft současně s podporou JavaScriptu představil i vlastní implementaci jazyka JavaScript (od IE 3). Tato implementace je známá pod jménem JScript. Aby bylo možné dosáhnout určité kompatibility, Evropská asociace výrobců počítačů ECMA stanovila normu. Této normě by měli jednotlivé specifikace JavaScriptu odpovídat. Více na stránkách ECMA - Standardizing Information and Communication Systems.

Poznámka: Všechny skripty uvedené v sérii článků pracují s Netscape Navigatorem nebo Microsoft Internet Explorerem verze 3 a vyšší. Pokud není uvedeno jinak!

  Část 1     Základy práce s JavaScriptem  

Zápis skriptu

  <script language="JavaScript" type="text/javascript">
  <!--
     vlastní kód
  //––>
  </script>
Tímto tagem prohlížeči sdělíme, že skript, který bude následovat, je napsán v JavaScriptu, a že MIME-type je "text/javascript". Pokud vynecháte definici TYPE nic se nestane, kód se provede stejně, ale není to podle standardu W3C.
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
Nyní skryjeme obsah skriptu před staršími prohlížeči pomocí triku s komentáři.
<!--
//––>
Před ukončení HTML komentáře přidáme dvě lomítka. Prohlížeče, které znají JavaScript, se někdy pokoušely interpretovat konec HTML komentáře za část skriptu. Konec skriptu nás vrátí do normálního HTML.
</SCRIPT>

Vložení skriptu do stránky

Abyste mohli používat skripty na svých stránkách, musíte vědět jak je do stránky vložit. Skript se vkládá mezi tagy <SCRIPT> a </SCRIPT>. V HTML stránce to potom může vypadat třeba takto:
  <script language="JavaScript" type="text/javascript">
  <!--
     alert("Ahoj světe!");
  //––>
  </script>
Skripty můžete ke stránce připojit i pomocí externího souboru. V tomto případě použijete parametr SRC s definicí URL skriptu. Takto připojené skripty mají obvykle koncovku .js:

<script language="JavaScript" src="mujsckript.js" type="text/javascript"></script>
Párový tag <SCRIPT> můžete na stránce použít kolikrát chcete. Nejlepší a nejsnadnější je však umístit celý skript na jedno místo a v jednotlivých částech stránky volat pouze funkce ve skriptu definované. (V některých vyjímečných případech budete muset skript rozdělit, abyste zajistili správné provedení skriptu.)

Při vkládání skriptu preferujte vložení pomocí externího souboru, což přináší značné výhody. Všeobecně se skript vkládá mezi tagy <HEAD> a </HEAD>. To zajišťuje, že skript bude připraven k použití ihned po načtení stránky. Sem je dobré vložit všechny funkce nebo skripty, které mají být funkční ještě před vlastním zobrazením stránky.

Jindy je třeba vložit skript mezi tagy <BODY> a </BODY>. Tento způsob vložení se používá, když skript generuje vlastní HTML obsah stránky.

Pro lehký úvod by to mohlo stačit. Příště si povíme něco víc o tagu <SCRIPT> a základech syntaxe. Snad se vám první díl líbil.

Diskuze (6) Další článek: GeForce 4 - 5. února

Témata článku: Software, Internet, Prohlížeče, Programování, Internet Explorer, Java, Javascript, Výuka, Navigator, Pre, Různé typy, Alert, Různá omezení, První komentář, Side, Lehký problém


Určitě si přečtěte

Cableporn: Podívejte se na úžasná díla umělců z podnikových serveroven

Cableporn: Podívejte se na úžasná díla umělců z podnikových serveroven

** Uspořádání kabelů můžete vnímat i jako podivný druh umění ** To nejkrásnější se skrývá v datacentrech a serverovnách ** Podívejte se na skutečné „cableporn“ z optiky i kroucené dvojlinky

Vojtěch Malý | 51

Vojtěch Malý
DatacentraServery
Google vymyslel technologii superpřesného GPS. Už ji podporuje Pixel 5 a dorazí i na ostatní telefony

Google vymyslel technologii superpřesného GPS. Už ji podporuje Pixel 5 a dorazí i na ostatní telefony

** Kvalita GPS ve městech občas stojí za starou bačkoru ** Mohou za to odrazy signálu od okolních budov ** Google má jejich 3D model, a tak spolupracuje s výrobci GPS čipů

Jakub Čížek | 40

Jakub Čížek
NavigaceTechnologieGoogle
Starlink podle betatesterů: Rychlejší a levnější než satelitní internet v Česku

Starlink podle betatesterů: Rychlejší a levnější než satelitní internet v Česku

** Reddit se začíná plnit zkušenostmi se Starlinkem ** Při přímé viditelnosti dá i 120 Mb/s ** Klasický satelitní internet už teď dalece překonává

Jakub Čížek | 48

Jakub Čížek
StarlinkPoskytovatelé internetu
Apple Macbook Air M1: testujeme výkon, výdrž, a hlavně kompatibilitu aplikací [průběžně aktualizováno]

Apple Macbook Air M1: testujeme výkon, výdrž, a hlavně kompatibilitu aplikací [průběžně aktualizováno]

** Testujeme Apple Macbook Air s procesorem M1 ** Zajímá nás nejen výkon, ale zejména kompatibilita aplikací ** Článek je průběžně doplňován na základě vašich dotazů

Jiří Kuruc | 205

Jiří Kuruc
Apple
Šmírování kamerami Googlu: Koukněte, co šíleného se objevilo na Street View

Šmírování kamerami Googlu: Koukněte, co šíleného se objevilo na Street View

Google stále fotí celý svět do své služby Street View. A novodobou zábavou je hledat v mapách Googlu vtipné záběry. Podívejte se na výběr nejlepších!

redakce | 4

redakce
Mapy GoogleStreet View
Fedora 33 prostě funguje. Linux si zaslouží dobýt laptop, je to ale asi opět marné

Fedora 33 prostě funguje. Linux si zaslouží dobýt laptop, je to ale asi opět marné

** Desktopový Linux funguje a vypadá stále lépe ** Fedora 33 není výjimkou ** Ve stínu Windows a macOS tu vyrostly skvělé alternativy

Jakub Čížek | 156

Jakub Čížek
FedoraOperační systémyLinux

Aktuální číslo časopisu Computer

Jak prodloužit výdrž notebooku

Velké testy: gamepady a inkoustové tiskárny

Důkladný test Sony Playstation 5