
Eurotel (20%)


T-Mobile (21%)


Oskar (26%)


Jiný (12%)


Nemám mobil (21%)



Javascript za 5 minut
Tento článek je určen pro ty, jež chtějí pochopit základní podstatu JavaScriptu, jak se používá a kam se vkládá. Není to žádná učebnice, jen spíše takový úvod pro ty, jež chtějí javascript na svých stránkách používat.
JavaScript je skriptovací jazyk, který se provádí na straně klienta tj. na cílovém počítači. Vkládá se do dokumetů HTML, buď přímo, nebo pomocí externího souboru K jeho běhu potřebujete pouze prohlížeč, podporující JavaScript. Zdrojový kód JavaScriptu se vkládá buď přímo do dokumentu:
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
--- kód JavaScriptu ---
</SCRIPT>
nebo do externího souboru s příponou .js :
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript" SRC="mujskript.js">
</SCRIPT>
Samozřejmě můžeme javascripty provést po určité akci nějakého objektu(onLoad, onMouseOver, ...), příkaz(y) se pak vkládají rovnou jako hodnota atributu:
<IMG SRC="obrazek.gif" OnMouseOver="this.src=\'obrazek2.gif\'">
Pokud vkládáme JavaScript přímo do dokumentu, bylo by vhodné celý kód vložit do komentáře. Vyhneme se tak nechtěnému zobrazování částí zdrojového kódu u prohlížečů, které JavaScript nepodporují:
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
--- kód JavaScriptu ---
// ->
</SCRIPT>
V Javascriptu můžeme psát více příkazů na řádek, ale pak je musíme oddělovat středníkem:
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
window.alert(\'Vítejte na mé stránce!\'); window.alert(\'Přeji mnoho zábavy.\');
// ->
</SCRIPT>
Teď, když víme, jak a kam se JavaScripty vkládají, vytvoříme si jednoduchý skript, který v vypíše text "Vítejte na mých stránkách":
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
document.write(\'Vítejte na mých stránkách\');
// ->
</SCRIPT>
Otázkou je, zdali v JavaScriptu psát jednoduché, nebo dvojité uvozovky. Obojí je správně, ale Vám doporučuji v JavaScriptu uvozovky vždy jednoduché, nevznikají pak problémy při vkládání JavaScriptů do efektu nějakého objektu. Dvojitými uvozovkami bych efekt předčasně ukončil a zbytek kódu by ležel jentak uprostřed tagu, což rozhodně není to pravé. Teď si ale ukážeme, jak v JavaScriptu provádět jednoduché početní operace:
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
cislo = 56 + 4;
document.write(\'Součet čísel 56 a 4 je: \'+cislo+\'.\');
// ->
</SCRIPT>
Nyní ale přichází okamžik, kdy budeme po uživateli vyžadovat určitá vstupní data. V následujícím skriptu použijeme funkci prompt, což je dialogové okno se vstupním polem.
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
jmeno=window.prompt(\'Jak se jmenujete ?\');
document.write(\'Vaše jméno je: \'+jmeno+\'.\');
// ->
</SCRIPT>
Další dvě funkce, které s uživatelem komunikují formou dialogových oken jsou alert a confirm. Obě si je (s opětovným využitím funkce prompt) představíme v dalším příkladu:
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
window.alert(\'Začínáme !\');
souhlas=window.confirm(\'Souhlasíš ?\');
barva=window.prompt(\'Jaká je tvoje oblíbená barva ?\');
document.write(\'Začali jsme.\');
if (souhlas) {document.write(\'<FONT COLOR="green">Souhlasil si.</FONT>\');} else
{document.write(\'<FONT COLOR="red">Nesouhlasil si.</FONT>\');}
document.write(\'Tvoje oblíbená barva je \'+barva+\'.\');
// ->
</SCRIPT>
Slabá stránka tohoto příkladu se projeví ve chvíli, kdy v dialogovém vstupním poli kliknete na STORNO. Jak si sami můžete ověřit, v tomto případě bude mít proměnná BARVA hodnotu NULL, což není ono. V tomto skriptu se pokusíme tuto chybu odstranit:
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
window.alert(\'Začínáme !\');
souhlas=window.confirm(\'Souhlasíš ?\');
barva=window.prompt(\'Jaká je tvoje oblíbená barva ?\');
document.write(\'Začali jsme.\');
if (souhlas) {document.write(\'<FONT COLOR="green">Souhlasil si.</FONT>\');} else
{document.write(\'<FONT COLOR="red">Nesouhlasil si.</FONT>\');}
if (barva==null) {document.write(\'Oblíbená barva nebyla zadána.\');} else
{document.write(\'Tvoje oblíbená barva je \'+barva+\'.\');}
// ->
</SCRIPT>
Použitím jiného operátoru celou věc ještě zjednodušíme:
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
window.alert(\'Začínáme !\');
souhlas=window.confirm(\'Souhlasíš ?\');
barva=window.prompt(\'Jaká je tvoje oblíbená barva ?\');
document.write(\'Začali jsme.\');
if (souhlas) {document.write(\'<FONT COLOR="green">Souhlasil si.</FONT>\');} else
{document.write(\'<FONT COLOR="red">Nesouhlasil si.</FONT>\');}
if (barva!=null) {document.write(\'Tvoje oblíbená barva je \'+barva+\'.\');}
// ->
</SCRIPT>
Na závěr snad jen to, že obsah Vašich stránek by měl být přístupný i prohlížečům bez javascriptu (nebo, pokud mají javascript vypnutý). První možností, jak toho docílit je používání javascriptu pouze na doplňkové efekty (jako například změna obrázku tlačítka po najetí myší atd.). Pokud chcete ale JavaScriptem vypisovat i informace, které se má návštěvník dozvědět, musíte udělat ještě "náhradní" text pro ty, kteří javascript nemají. Tento text pak vložíte kamkoli do těla dokumentu mezi tagy <noscript> a </noscript>. Existují i takoví rádoby webdesignéři, kteří mezi tyto tagy napíší text typu Pořiďte si lepší prohlížeč!. To je ale rozhodně neprofesionální. I trochu rozházený design totiž určitě působí lépe, než-li takovéto hlášky. Věřím, že javascript budete používat jen střízlivě a s rozvahou, v opačném případě to může silně zeštíhlit množství Vašich návštěvníků.
Věc | Autor | Datum a čas |
K článku nejsou žádné komentáře. | ||
Zobrazit Vše | Přidat nový |