e-gradiva     HTML CSS JavaScript Načrtovanje    
  logotip  
SERŠ Maribor Iskanje Primeri

Starost

Koda:
<form id='rojen'>
rojen:
<input type='text' name='rojen_dan' size="2" value='30'
onkeyup="prikazi()" maxlength="2" onfocus="select()" /> .
<input type='text' name='rojen_mesec' size="2" value='10'
onkeyup="prikazi()" maxlength="2" onfocus="select()" /> .
<input type='text' name='rojen_leto' size="4" value='1985'
onkeyup="prikazi()" maxlength="4" onfocus="select()" />
</form>


<p>Star si <span id="leta"></span> let,
<span id="meseci"></span>  mesecev in
<span id="dnevi"></span>  dni.</p>

<script type="text/javascript">

function meseci()
{
this.length = 12;
this[0] = 31;
this[1] = 28;
this[2] = 31;
this[3] = 30;
this[4] = 31;
this[5] = 30;
this[6] = 31;
this[7] = 31;
this[8] = 30;
this[9] = 31;
this[10] = 30;
this[11] = 31;
}
var dte = new meseci();


function prikazi()
{

sedaj = new Date();
var TaMesec = sedaj.getMonth();
var TaDan = sedaj.getDate();
var ToLeto = sedaj.getFullYear();

if (document.forms.rojen.rojen_dan.value > TaDan)
{
TaDan += dte[TaMesec];
TaMesec--;
}

if (document.forms.rojen.rojen_mesec.value > TaMesec)
{
TaMesec += 12;
ToLeto--;
}

var leta = ToLeto - document.forms.rojen.rojen_leto.value;
var meseci =TaMesec - document.forms.rojen.rojen_mesec.value;
var dnevi =TaDan - document.forms.rojen.rojen_dan.value;

if (meseci==12)
{
meseci=0
leta++
}

document.getElementById("leta").firstChild.nodeValue = leta;
document.getElementById("meseci").firstChild.nodeValue = meseci;
document.getElementById("dnevi").firstChild.nodeValue = dnevi;

}


</script>
Izgled v
brskalniku:
rojen: . .

Star si   let,    mesecev in    dni.

Razlaga:

Zgoraj je zapisan kratek program, ki na osnovi današnjega datuma in datuma vašega rojstva izračuna vašo starost na dan natančno . V kodi HTML je element form v katerem so gnezdeni trije elementi input, ki predstavljajo polja kamor vnašate podatke. Skripta jih razlikuje na osnovi njihovega atributa name, saj ima vsak od teh trehelementov v tej lastnosti drugačno vrednost.

Naloga funkcija meseci() je, da ustvari predmet in mu določi 12 lastnosti. V tem primeru se predmet imenuje meseci. Njegove lastnosti pa so števila dnevov ustreznega meseca. Prva vredbost se imenuje 0 zato, ker JavaScript šteje števila mesecev od 0 dalje. Po funkciji je deklarirana spremenljivka dte, ki se ji priredi vsebina tako, da ustvari nov predmet razreda meseci, to se doseže z naslednjim stavkom var dte = new meseci();.

Funkcija prikazi() najprej ustvari nov predmet razreda Date in ga shrani v spremenljivko sedaj. Z uporabo postopkov getMonth(), getDate() in getFullYear(), se iz spremenljivke sedaj v spremenljivke TaMesec, TaDan in ToLeto, shranijo trenutni mesec, dan in leto.

Nato funkcija prikazi() s stavkom if preveri, če je vrednost, ki ste jo vnesli za dan vašega rojstva večja od vrednosti spremenljivke TaDan. Če je, se spremenljivki TaDan prišteje število dnevov v tem mesecu (v ta namen je napisana funkcija meseci()), vrednost spremenljivke TaMesec pa se zmanjša za ena. Podobno se zgodi za vrednost, ki ste jo vnesli kot mesec vašega rojstva. Razlika je v tem, da se tu spremenljivki TaMesec prišteje število mescov v letu, spremenljivka ToLeto pa se zmanjša za ena.

Zgornja dva if stavka se izvedeta zato, ker se starost ugotovi tako da se izračunajo razlike med spremenljivkami ToLeto, TaMesec in TaDan ter ustreznim vnesenimi vrednostmi (npr. ToLeto - rojen.rojen_leto.value). Izračunane vrednosti se shranijo v spremenljivke leta, meseci in dnevi. Funkcija potem preveri, če je vrednost spremenljivke meseci enako 12 in v tem primeru spremenljivki meseci priredi vrednost 0, spremenljivki leta pa se vrednost poveča za ena.

Ko se po teh postopkih vse vrednosti izračunajo se v html dokumentu na osnovi razločevalnih id najdejo ustrezni predmeti. V teh primerih so to elementi span. V dokument se spremenljivka vpiše tako, da svojo vrednost priredi lastnosti .firstChild.nodeValue ustreznega predmeta. Funkcija se kliče ob vpisu nove vrednosti.

Opisani primer ne preverja pravilnost vpisanega datuma.

SERŠ Maribor : Strokovna gimnazija : 2004 : Danijel Mom