JavaScript Date Objekt
Date objekti kasutatakse aja ja daatumite toimetamisel.
Näited:
Hetke aeg ja kuupäev
Selles näites demonstreeritakse kuidas kasutada Date() meetodit selleks, et saada tulemuseks hetke aeg ja daatum.
FullYear()
FullYear() kasutamine kuupäeva määramiseks.
Day()
Day() kasutamine nädalapäeva määramiseks.
Kell
Selles näites demonstreeritakse kuidas kuvatakse kella.
Siin on nimestik kõigist date objektide omadustest ja meetoditest koos kirjelduste ja näidetega.
Date objektide nimestik
Aja määramine
"Date" objekti kasutatakse kuupäeva ja kellaaja määramiseks.
Pane tähele: "Date" objekti esialgseks väärtuseks on hetke kuupäev ja aeg.
"Date" objekt määratakse võtmesõnaga. Selles näites on objekti võtmesõna koodis "myDate":
var myDate=new Date()
Daatumitega on lihtne manipuleerida, kasutades selleks "Date" objekti meetodeid.
Selles näites määratakse üks kindel kuupäev (13. Mai 2015):
var myDate=new Date(); myDate.setFullYear(2015,04,13);
Daatumeid saab omavahel võrrelda. Selles näites, hetke kuupäeva võrreldakse 13. Mai 2015 daatumiga:
var myDate=new Date();
myDate.setFullYear(2015,05,13);
var today = new Date();
if (myDate>today)
{
alert("13. Mai 2015 on pärast tänast päeva");
}
else
{
alert("13. Mai 2015 on enne tänast päeva");
}
Inline Tooltip
Tekstis olevatele linkidele lisatakse tihti <title> element selleks, et anda täiendavat
informatsiooni lingi kohta. Nagu näiteks siin.
Kui selline info-aken (tooltip) tundub häiriv siis saab infot edastada ka teistmoodi.
Allpool on kaks näidet, kus tooltip on otse teksti sees:
Link mitte kuhugi
See on tooltip tekst
Link mitte kuhugi
See on tooltip tekst
Nüüd vaatame mismoodi sellist tooltip skripti luua.
Kõigepealt kopeeri allpool olev kood oma veebidokumendi "head" sektsiooni.
<script type="text/javascript">
function toggleInline(t) {
var x = document.getElementById(t).style;
if (x.display == 'inline') x.display = 'none';
else x.display = 'inline';
return false;
}
</script>,
Järgmiseks loome stiili e. mismoodi hakkab tooltip välja nägema. Siin saad ise teha muudatusi. See kood kleebi samuti oma dokumendi "head" sektsiooni. Sellel lehel olev stiil on selline:
<style type="text/css">
.intip {font-style:italic;font-weight:bold;display:none;}
</style>
Edasi kirjuta järgmine kood oma dokumendi "body" sektsiooni. Sellega sa lood lingi millega hakkab tooltip töötama. Antud juhul siis kui kursorit liigutada üle lingi ( onmouseover ).
<a href="#" onmouseover="toggleInline('tt1');"
onmouseout="toggleInline('tt1');">Link mitte kuhugi</a>
Selline kood töötab siis kui lingile klikkida ( onclick ).
<a href="#" onclick="toggleInline('tt1');">Link mitte kuhugi</a>
Järgnev kood kirjuta kohe lingi järel. Selles hakkab olema tooltip tekst.
<span id="tt1" class="intip">See on tooltip tekst</span>
