JavaScript/Juandev

Z Wikiverzity

Tak jsem musel zakoupit knihu za 600. Myslím, že to ale stojí za to, konečně je něco pořádně didakticky propracováno. I když starší tak určitě záživnější.

Hodina 1[editovat]

  • že je JavaScript dobrým vstupem do programování, no uvidíme, kdysi jsem naprogramoval Pivní výukový program v QBasicu - možná bych ho ještě našel:-)
  • nějaké další knihovny:
  • a staří známí:
  • a ještě další kamarádi od Molly:
  • všude říkaj, může te si od nás skopírovat kód, ale já říkám není to tak snadné, musím znát alespoň základy. Jistě se to do budoucna hodí, číst kód jiných, ale teď je to na bandasku.
  • dozvěděl jsem se, že alternativou JavaScriptu jsou:
    • CGI - nevhodné, protože to na rozdíl od JS běží na straně serveru --> nicméně na svém současném hotingu mohu s CGI něco dělat, tak bych to měl prozkoumat--Juandev 29. 12. 2009, 08:19 (UTC)
    • VBScript je Visual Basic Script - tomu bych mohl rozumět, ale jede to jen na IE a Windows, čili unusefull
    • Java
    • Flash - ten se budu asi muset ještě naučit:-)
  • důležitá věc je, že JavaScript nemůže komunikovat se serverem, protože pouze vykonává operace ve webovém prohlížeči. Nicméně může předávat data do nějakého programu na straně serveru. Čili vždy je třeba znát co ten či onen server umí/poskytuje.
  • samozřejmě každý prohlížeč interpretuje JS jinak
  • JavaScriptovej komentář se buď odděluje dvěma lomítky, tedy:
    <script type="text/javascript">//halo, toto je komentar</script>
    
    , nebo jako v CSS:
    /* toto je komentar */
    
  • u vloženého JavaScriptu v hlavě HTML dokumentu je dobré tento skript skrývat. To se dělá pomocí HTML a JS komentáře: <!-- //-->, resp. <script><!-- bla bla bla //--></script>.
  • každý příkaz se v JS odděluje ENTERem nebo středníkem, ideální je oběmi metodami, tedy co řádek to příkaz zakončený středníkem
  • a je tu můj první skript:
<script type="text/javascript">
 alert("Hello, world!");
 </script>

Tak to je vše přátelé.--Juandev 17. 12. 2009, 17:42 (UTC)

Příklady[editovat]

<html>
<head>
<title>Hello, world!</title>
</head>
<body>
<h1>O Hello, world!</h1>
<p>Hello, world! je nazev nejednodussiho programu, ktery musime zkusit vyrobit v kazdem programovacim jazyce.</p>
<script type = "text/javascript">
<!--
alert("Hello, world!"); //vyvola hlasku typu "Hello, world!"
// -->
</script>
<h2>O programu</h2>
<p>Prave jste zjistili, jak tento program funguje.</p>
</body>
</html>

Skrypt: Vyhledávání fotek v kategorii na Commons[editovat]

$( function() {$( '#mw-category-media' ).prepend( $( '<form><label for="mediastart">View files starting from:</label> <input id="mediastart" name="filefrom"><input type="submit"></form>' ) )});

$....identifier identifikující objekt, alias pro funkci document.getElementById()

  • takže, kdyby ve výše uvedeném příklad byl první $ funkcí, pak by to vypadalo následovně:
document.getElementById (
    function() {$( '#mw-category-media' ).prepend( $( '<form><label for="mediastart">View files starting from:</label> <input id="mediastart" name="filefrom"><input type="submit"></form>' ) )}
    );
  • ;.....ukončuje statement
  • getElementById()...metoda, která vypíše ID prvního elementu v HTML dokumentu
  • document....objekt reprezentující danou webovou stránku, zpřístupňuje danou html stránku
  • {}....deklaruje objekt, objekt může obsahovat více proměných
  • function().....v js vnořený function constructor, metoda, která samostatně bez spuštění spouští objekt (viz výše)
document.getElementById (
    function() {
        $( '#mw-category-media' ).prepend( $( '<form><label for="mediastart">View files starting from:</label> <input id="mediastart" name="filefrom"><input type="submit"></form>' ) )
            }
    );
  • prepend()............metoda vkládající uzlové objekty, nebo DOMřetězce mezi uzel a child uzel
    • takže to co je zde v prepepend, je HTML kód, který se někam vloží na stránku, je tam formulář, popis formuláře, a dvě zadávací pole se svými identifikátory.
  • takže $ry zde asi identifikují objekty
    • 1. objekt je #mw-category-media, tedy v html kódu ID divu obkopující fotky <div id="mw-category-media"></div>, který zahrnuje fotografie, plus ale i tento skrypt (tak jestli to nedělá problém v tom, že to zahrnuje tento skrypt?
    • 2. objekt pak vkládá formulář, submit buton a jeho popis - vkládá de facto HTML
document.getElementById (
    function() {
        $(
            '#mw-category-media'
            )
        .prepend(
            $( '<form><label for="mediastart">View files starting from:</label> <input id="mediastart" name="filefrom"><input type="submit"></form>' ) 
            )
            }
    );
  • . (tečka).....