Osnove JavaScript

Do zdaj ste v okviru tečaja spoznali večinoma programski jezik PHP ter podatkovne baze MySQL. Obe tehnologiji se izvajata na strežniku (ang. server-side), kar pomeni, da z njima zgeneriramo spletno stran, preden jo pošljemo uporabniku v njegov spletni brskalnik.

Ko si uporabnik enkrat spletno stran ogleduje v svojem brskalniku, ima možnost, da klikne kakšno povezavo ali pa odda spletni obrazec — v teh primerih se našemu strežniku spet pošlje nov zahtevek (ang. request), ki ga naš PHP program lahko obdela in nanj odgovori z naslednjo spletno stranjo.

Če pa uporabnik med ogledovanjem spletne strani v svojem brskalniku na naš strežnik ne pošlje nobenih dodatnih zahtevkov, pa s PHP kodo na delovanje spletne strani ne moremo več vplivati. Tukaj pa nam pomaga JavaScript.

Kaj je JavaScript?

JavaScript je programski jezik, s katerim lahko napišemo kodo, ki jo vključimo v HTML spletno stran. Ta koda se potem izvaja v spletnem brskalniku uporabnika, tačas ko si ogleduje našo spletno stran.

Temu pravimo, da se JavaScript koda izvaja na odjemalčevi strani (ang. client-side).

Primer: Pogosto želimo že med samim tipkanjem preverjati, če je uporabnik v vnosno polje vnesel ustrezen podatek.

S PHP kodo bomo lahko vsebino vnosnega polja preverili šele takrat, ko bo uporabnik izpolnjen spletni obrazec s klikom gumba za oddajo poslal našemu strežniku.

JavaScript koda pa se izvaja neprestano v brskalniku uporabnika, tako da lahko vsebino vnosnega polja preverjamo sproti.

JavaScript kodo zapišemo med znački <script> in </script>.

Primer kode JavaScript, ki jo vključimo v HTML stran:

E-poštni naslov: <input type="text" name="email" id="email" /><br />
<input type="submit" value="Prijavi me na novičke!" />

<script>
   // izberemo vnosno polje, ki nas zanima
   var vnosno_polje = document.getElementById("email");

   // ob vnosu vsakega znaka v vnosno polje se izvede sledeča koda
   vnosno_polje.onkeyup = function() {
      // preberemo trenutno vsebino vnosnega polja
      var vsebina = vnosno_polje.value;

      // preverimo, če je zadnji znak vnosnega polja v tem trenutku afna
      if (vsebina.substr(-1) == "@") {
         // uporabnik je vnesel afno, pokažimo obvestilo
         alert("Vpisali ste afno.");
      }
   };
</script>

Delovanje zgornje kode si lahko ogledate na tem primeru:

E-poštni naslov:    Prijavi me na novičke!

V trenutku, ko boste v vnosno polje za e-poštni naslov vpisali afno @, vas bo spletni brskalnik o tem obvestil s pojavnim oknom.

JavaScript koda nam omogoča, da vplivamo na izkušnjo naših uporabnikov že med samim tipkanjem e-poštnega naslova, čeprav takrat spletni brskalnik ne pošilja ničesar našemu strežniku in posledično naši PHP kodi.

Prednosti uporabe JavaScript

Z JavaScript kodo lahko torej v brskalniku storite marsikaj koristnega:

• preverite ustreznost podatkov, še preden uporabnik odda obrazec¹
• prikažete interaktivne elemente, npr. koledar²
• prikažete obvestila in pojavna okna
• animirate gibanje elementov
• ... in še mnogo drugega

Cilj našega brezplačnega PHP tečaja je primarno v tem, da vas naučimo, kako programirati s tehnologijama PHP in MySQL.

Pri programiranju v PHP in MySQL pa ste tekom tečaja neverjetno napredovali!

Čaka vas le še zadnje poglavje...

Prejšnje poglavje
PHP + MySQL