JavaScript - 4. lekce
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu
Reklama

JavaScript - 4. lekceJavaScript - 4. lekce

 

JavaScript - 4. lekce

Google       Google       22. 1. 2006       25 922×

  • Funkce pokročileji
  • Přehled událostí

Reklama
Reklama

Funkce

V předchozí lekci jsem vám lehce nastínil jak se dá použít v JavaScriptu funkce. V tomto pokračování zabrousíme hlouběji do problematiky funkcí. Funkce je zpravidla sada několika po sobě jdoucích příkazů (pokud by byl jeden, nemá téměř smysl v praxi takovou funkci vytvářet), které se postupně vykonají při volání funkce. Funkce může dostal, ale také nemusí nějaké vstupní hodnoty. Tyto hodnoty označujeme jako parametry funkce a jedná se o hodnoty z "vnějšího prostředí", se kterými se potom pracuje uvnitř funkce. Naše příkladová funkce z minulé lekce obsahovala právě jeden parametr. V dalším příkladu je ukázka funkce o dvou parametrech. Fungovat by to mělo následovně - po stisku tlačítka se do divu s identifikátorem, který předáme jako první parametr, zobrazí obrázek, jehož pozici předáme jako druhý parametr.


<head>
  <script language="JavaScript" type="text/javascript">
    function zobrazObrazek(divid,obr) {
      var div = document.getElementById(divid);
      div.innerHTML = "<img src=\"" + obr + "\" alt=\"\" />";
    }
  </script>
</head>
<body>
  <input type="button" onClick="zobrazObrazek('div1','obr/obrazek.png');" value="zobrazit" />
  <div id="div1"></div>
</body>

Popíšem si tedy průběh funkce. Po její inicializaci se do proměnné div uloží "cesta" k obsahu divu s identifkátorem, který byl zadán jako parametr při volání funkce. Klíčové slovo document značí objekt celého dokumentu, ve kterém skript pracuje, ale o objektech si řekneme více až v pozdějších lekcích. Dále následuje úsek getElementById() a pokud máte alespon základní znalost angličtiny, zajisté víte co tato funkce (metoda objektu document) bude dělat - najde si v dokumentu element s identifikátorem, který byl předán jako parametr při volání funkce (v našem případě "div1"). Tímto elemntem nemusí být pouze div, ale jakýkoliv tag s přiřazeným identifikátorem. Na druhém řádku přidáváme vlastnost innerHTML, která říká, že se bude pracovat s obsahem (doslovný překlad - vnitřní HTML). V druhém řádku funkce dále už jen určujeme, jakou hodnotu element dostane (v tomto příkladu obrázek, přičemž jeho cestu vkládáme jako druhý parametr funkce).

Druhý příklad

Do hlavičky zapisujeme:


<script language="JavaScript" type="text/javascript">
  function zmena() {
    document.all.text.style.color="red";
  }
</script>

A do těla dokumentu:


<span id="text">Text, který se po stisku tlačítka změní.</span>
<input type="button" onclick="zmena();" value="Změň barvu">

Račte si sami zkusit i druhý příklad:

Text, kterému se změní barva.

Vysvětlení nejasností:

  • input - tagem input zahajujeme zápis každého tlačítka, kolonky atd. Značí, že daný objekt vkládáme do stránky.
  • button - říká, že chceme zobrazit tlačítko
  • value - zbrazuje na tlačítku text, v našem případě "Stiskni" a "Změň barvu"

Přehled událostí

Událost Stane se při:
onmouseover najetí kurzorem na objekt
onmouseout odjetí kurzoru z objektu
onclick kliknutí na tlačítko myši
ondblclick dvojitém kliknutí na tlačítko myši
onmousedown stisku tlačítka myši
onmouseup uvolnění tlačítka myši
onmousedrag pohybu myší se stisknutým tlačítkem
onmousewheel rolování kolečkem
onmousemove pohybu myší
onkeydown stisku libovolné klávesy
onkeyup uvlonění libovolné klávesy
onback stisknutí tlačítka zpět v prohlížeči
onfoward stisnutí tlačítka vpřed v prohlížeči
onload nahrávání dokumentu
onunload zavření dokumentu
onmove pohybu s oknem prohlížeče

Úkol

Vytvořte stránku, kde bude nějaký text a vedle něj tlačítko. Když na tlačítko zmáčknete jednou, musí se barva textu změnit na zelenou, když zmáčknete na tlačítko dvakrát, musí se barva textu změnit na žlutou.

×Odeslání článku na tvůj Kindle

Zadej svůj Kindle e-mail a my ti pošleme článek na tvůj Kindle.
Musíš mít povolený příjem obsahu do svého Kindle z naší e-mailové adresy kindle@programujte.com.

E-mailová adresa (např. novak@kindle.com):

TIP: Pokud chceš dostávat naše články každé ráno do svého Kindle, koukni do sekce Články do Kindle.

Tagy:
Hlasování bylo ukončeno    
0 hlasů
Google
(fotka) Tomáš BobekAutor je designérem stránek (2D grafika), ovládá jazyky HTML, CSS, PHP, JavaScript a zajímá se o programování v Javě.Krom programujte.com se podílí na projektech maths.cz (jako redaktor a grafik), ceskewebstudio.cz (jako designér) a webber.cz (jako JavaScript scriptař). Ostatní volný čas rád tráví s přáteli nebo sportuje (tenis, nohejbal, hokejbal, závodně fotbal).
Web     Twitter     Facebook    

Nové články

Obrázek ke článku Blockchain & Bitcoin konference

Blockchain & Bitcoin konference

V pátek 19. 5. 2017 se v pražském konferenčním centru Andel’s konala Blockchain & Bitcoin konference. Řada odborníků a podnikatelů v oboru blockchainu a kryptoměn představila možnosti budoucího směřování tohoto oboru. Speakeři většinou rusky mluvící provenience prezentovali řešení svých firem založená na technologii blockchainu.

Reklama
Reklama
Obrázek ke článku Malware KONNI se úspěšně skrýval 3 roky. Odhalil ho bezpečnostní tým Cisco Talos

Malware KONNI se úspěšně skrýval 3 roky. Odhalil ho bezpečnostní tým Cisco Talos

Bezpečnostní tým Cisco Talos odhalil celkem 4 kampaně dosud neobjeveného malwaru, který dostal jméno KONNI. Ten se dokázal úspěšně maskovat od roku 2014. Zpočátku se malware zaměřoval pouze na krádeže citlivých dat. Za 3 roky se ale několikrát vyvinul, přičemž jeho současná verze umožňuje útočníkovi z infikovaného počítače nejenom krást data, ale i mapovat stisky na klávesnici, pořizovat screenshoty obrazovky či v zařízení spustit libovolný kód. Pro odvedení pozornosti oběti zasílali útočníci v příloze také obrázek, zprávu a výhružkách severokorejského režimu či kontakty na členy mezinárodních organizací.

Obrázek ke článku Pouze jedna z deseti lokálních firem ví o pokutách plynoucích z GDPR

Pouze jedna z deseti lokálních firem ví o pokutách plynoucích z GDPR

Trend Micro, celosvětový lídr v oblasti bezpečnostních řešení a VMware, přední světový dodavatel cloudové infrastruktury a řešení pro podnikovou mobilitu, oznámily výsledky výzkumu mezi českými a slovenskými manažery zodpovědnými za ochranu osobních údajů, který zjišťoval, jak jsou připraveni na nové nařízení o ochraně osobních údajů (GDPR). Většina firem v České republice a na Slovensku nad 100 zaměstnanců je již s novým nařízením GDPR obeznámena. Výzkum provedený ve spolupráci s agenturou Ipsos ukázal, že téměř 8 firem z 10 o nařízení ví, přičemž jeho znalost je o něco vyšší na Slovensku (89 %) než v České republice (69 %).

Obrázek ke článku Vyděračský software Locky se vrací, tváří se jako potvrzení platby, odhalil tým Cisco Talos

Vyděračský software Locky se vrací, tváří se jako potvrzení platby, odhalil tým Cisco Talos

Jeden z nejznámějších ransomwarů, Locky, se vrací. Po většinu roku 2016 patřil mezi nejrozšířenější vyděračské softwary. Ke svému šíření využíval emailové kampaně s infikovanými přílohami. Ransomware Locky byl rozesílán prostřednictvím botnetu (internetový robot zasílající spamy) Necurs. Jeho aktivita na konci roku 2016 téměř upadla a spolu s ní i šíření ransomwaru Locky. Před několika týdny se Necurs opět probudil a začal posílat spamy nabízející výhodný nákup akcií. Dne 21. dubna zaznamenal bezpečnostní tým Cisco Talos první velkou kampaň ransomwaru Locky prostřednictvím botnetu Necurs za posledních několik měsíců.

loadingtransparent (function() { var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })();
Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032017 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý