WEB-ohjelmointi, JavaScript

© Hannu Natunen 2001


Index

HTML ja ohjelmointi
Asiakas / Palvelin
Meta-elementti
JavaScript
Scriptien käyttö


HTML ja ohjelmointi

Web-ohjelmointi on laaja käsite. Onhan itse web-sivun tekeminenkin HTML-kielellä ohjelmointia. HTML-kieli on kuitenkin alunperin tarkoitettu vain tekstiä ja kuvia sisältävien hypertekstisivujen luontiin, eikä standardi sisällä minkäänlaisia työkaluja aikaansaada dynaamisuutta web-esityksiin.
Dynaamisuuden mahdollistamiseksi ovat monet yhteisöt ja ohjelmistovalmistajat kehittäneet enemmän tai vähemmän toimivia HTML-laajennuksia ja ohjelmointikieliä tätä varten. 
Moni näistä kehitelmistä on vuosien mittaan jäänyt pois käytöstä, jotkut taas ovat suuren suosion myötä kehittyneet päteviksi keinoiksi saada netti elävämmän näköiseksi.

Web-ohjelmointi jaetaan kahteen kategoriaan: palvelinpuolen- (server-side) ohjelmointi ja asiakaspuolen- (client-side)
ohjelmointi. Molemmissa on omat hyvät ja huonot puolensa. Tee-Se-Itse-henkilöille asiakaspuolen ohjelmointi, esim: JavaScript on käytännössä ainoa helposti hallittavissa oleva vaihtoehto. 


Asiakaspuolen tietojenkäsittely (client-side computing)

Asiakaspuolen ohjelmat ajetaan nimensä mukaan asiakkaan koneessa. Tällä tarkoitetaan sitä että palvelimelta lähetetään käyttäjän koneelle ohjelman lähdekoodi tai "puolikäännetty" ohjelmakoodi, joka suoritetaan vasta käyttäjän koneella. Yleensä käyttäjällä pitää koodin suorittamiseksi olla tulkkausohjelma, joka kääntää lähetetyn koodin prosessorikohtaiseksi konekieleksi. Selaimissa on nykyisin käytetyimmille asiakaspuolen ohjelmointikielille oma tulkkinsa. Kuitenkin riippuen selaimesta ja sen asetuksista kaikkialla eivät toimi asiakaspuolen sovellukset. 

Etuna verratessa palvelinpuolen sovelluksiin nähden on se, että asiakaspuolen ohjelmat eivät rasita palvelinta koska ne ajetaan käyttäjän koneella. Myöskään palvelimella ei tarvita sovelluksen suorittamiseen ohjelmistoja eikä suoritusoikeuksia. Huonon puolen aiheuttaa niiden selainriippuvuus eli ohjelmia ei voida suorittaa aivan missä tahansa selaimessa. Lohtuna selainriippuvuuteen on se, että nykyiset selaimet sisältävät jonkintasoisen tulkkausohjelman. 

Tyypillisiä asiakaspuolen ohjemointiin tarkoittettuja ohjemointikieliä ovat:

  • Java (Sun Microsystem)
  • JavaScript (Netscape)
  • ActiveX, (Microsoft)
  • VBScript (Microsoft)

Palvelinpuolen tietojenkäsittely (server-side computing)

Palvelinpuolen sovellukset suoritetaan jo palvelimella. Tällöin ohjelmisto, esim WEB-selain, käynnistää palvelimella sijaitsevan ohjelman, jonka jälkeen palvelin palauttaa ohjelman tuloksen selaimelle.
Palvelinpuolen ohjelmointiin on suosituin rajapinta CGI (Common Gateway Interface). Yleensä puhutaankin palvelinpuolen ohjemoinnin sijasta CGI-ohjelmoinnista.


Common = yleinen, toimii useammissa laiteympäristöissä.
Gateway = käytävä, jonkin välillä (palvelimen ja ohjelman).
Interface = käyttöliittymä (rajapinta) 

Tyypillinen CGI-ohjelman käyttökohde on vaikkapa liikennöitsijän aikataulutietoja tarjoava palvelu, jossa käyttäjä voi valinnoillaan vaikuttaa palvelimella suoritettaviin tietokantahakuihin.

ASP (Active Server Pages) on Microsoftin yritys tuottaa helpommin päivitettäviä sivuja. Tämä tekniikka toimii ainoastaan Microsoftin palvelimella, joten jos vaatimuksena on sovelluksien toimiminen myös muissa ympäristöissä, täytyy ASP unohtaa. FrontPage 2000:n sisältämät laajennukset käyttävät ASP:a

Tyypillisiä palvelinpuolen ohjemointiin tarkoittettuja ohjemointikieliä ovat:

  • C / C++
  • Perl
  • Python
  • Java

Meta-elementti

Joitakin automaattisesti käynnistyviä toimintoja saadaan aikaan myös pelkkää HTML.ää käyttäen. Näissä tapauksissa komennot upotetaan osaksi selaajalle näkymättömiä META-tietoja.
Yksi tällainen komento on ClientPull, eli asiakkaan uudelleenohjaus seuraavalle sivulle, tai kokonaan uuteen osoitteeseen.

 ClienPull-tagi on seuraavanlainen:

<meta http-equiv="refresh" content="10; URL=../terve_maailma.htm">

Tagi sijoitetaan muiden META tietojen joukkoon. Mallin komento siirtää selaajan 10 sekunnin kuluttua samassa hakemistossa sijaitsevalle terve_maailma.htm nimiselle sivulle. URL voi olla myös absoluuttinen.

Lähdekoodin voit luntata tästä


JavaScript

JavaScript on Java-kielestä kehitetty olio-pohjainen ohjelmointikieli,jonka tarkoituksena on helpottaa interaktiivisten multimedia sovellusten kehittelyä. Varsinaisen helpotuksen tuo mukanaan HTML-kielen ja JavaScript-kielen yhteiskäyttö. Javassa ei ole mahdollisuutta hyödyntää mitenkään HTML-kielen helppoutta luoda graafisia elementtejä (painonappeja, valintalistoja jne.) JavaScriptissä elementtien luonti onnistuu helposti HTML-kielen tageilla ja elementit linkitetään osaksi ohjelmaa. JavaScript-ohjelmat pystyvät vastaamaan käyttäjän tekemiin tapahtumiin, kuten hiiren napsautuksiin ja sivun valintaan. HTML-kielisiin esityksiin saadaan näin "älykkyyttä", koska esimerkiksi elementtien sisältämä informaatio voidaan lukea, ja palauttaa heti käyttäjälle.

JavaScript-kielinen ohjelma on varsinaisesti osa HTML-dokumenttia, ohjelman lähdekoodi on siten nähtävissä selaimien menukomennolla view / source, näytä / lähdekoodi . JavaScript muistuttaa Java-kieltä, mutta siitä puuttuu vahva tyypitys, joka Java-kielessä on olennaista. Kieli tukee myös funktioita, kuten Java mutta ilman funktioiden määrittelyä. Tyypityksen ja funktioiden määrittelyn pois jättäminen alentaa samalla ohjelmointikynnystä - lähes kuka tahansa voi kirjoittaa JavaScript-kielisiä ohjelmia.

Meidän ei ole tarkoitus kurssin puitteissa puuttua varsinaiseen ohjelmointiin, vaan selvittää, kuinka jo olemassa olevat scriptit voidaan käyttää osana HTML:ää


Scriptien käyttö

HTML -koodiin upotettu

JavaScript -koodi lisätään HTML -sivuun <SCRIPT> - tagilla. Tagiin sisältyvä LANGUAGE -parametri ei ole pakollinen mutta hyödyllinen ainakin jos sivulla käytetään useampia ohjelmointikieliä.

<SCRIPT LANGUAGE="JavaScript"> Koodi tähän </SCRIPT>

Näitä <SCRIPT> tagipareja voi olla sivulla vaikka kuinka monta ja se voidaan mihin kohtaan sivua tahansa. Useimmiten elementti sijoitetaan kuitenkin HEAD -elementin sisään, syystä että HEAD -elementin sisältämät tiedot ladataan dokumentistä ensimmäisenä.

Lataaminen erillisestä hakemistosta

JavaScript -koodi voidaan ladata sivulle myös erillisestä hakemistosta omana tiedostonaan. JavaScriptiä sisältävän tiedoston tarkennin on .js
Tässä tapauksessa SCRIPT -elementin syntaksi voisi olla seuraavanlainen:

<SCRIPT LANGUAGE="JavaScript" SRC=/scrptit/miinaharava.js></SCRIPT>

Lisääminen toimintoon

JavaScript -koodi voidaan myös liittää suoraan johonkin HTML -toimintoon. Seuraavassa esimerkissä JavaScriptillä höystetty normaali linkkikomento, joka avaa kohteen määrätyn kokoiseen uuteen selainikkunaan

<a href="uusiikkuna_malli" onClick="window.open('uusiikkuna_malli.htm', 'index', 'width=600,height=450,scrollbars=no,menubar=no,status=no');return false;">Tästä</a>

Mallin näet valmiina Tästä


| 26.8.2002 |