
Javascript är ett av de enklaste skriptspråken. Det här
är en nybörjarguide där du hittar de mest användbara skripten för just din
hemsida.
Just nu finns det bara några skript här, men jag håller på för fullt med
att skriva in fler, det kommer!
Scripten är fria att använda på din egen
hemsida, men lägg in följande efter <SCRIPT
LANGUAGE="JavaScript"> för att allt ska skötas rätt:
<!--- Denna kod finns tillgänglig på www.rajtzing.com.
//-->
- Vad är javascript?
- Lite introduktion
- Funktioner
Några användbara skript till din hemsida
- Mailscript
- Klocka
Vad är javascript?
Javascript är det mest använda programmeringsspråket på internet
just nu, anledningen är att javascript fungerar med alla webbläsare och det
fungerar oavsett om du kan ha skript på ditt hemsidekonto eller inte.
Javascript är också det enda skript som körs i användarens webbläsare.
Nästan alla andra körs direkt på webbservern.
Det du kan göra med javascript är t ex:
- Hantera info från ett formulär.
- Ändra egenskaper för element på hemsidan.
Lite indroduktion
För att inleda en JavaScript-kod på din sida använder du dig av en tagg som
du säkert känner igen, nämligen <SCRIPT> lite javascript...
</SCRIPT>, inte speciellt svårt va?
Det finns också olika JavaScript-versioner (version 1.0, 1.1, 1.2 och 1.3). De
olika verisonerna kan också visas direkt i koden, men om du t ex skriver
"JavaScript 1.1" så är det bara de webläsare med JavaScript 1.1 som
kan tolka koden, dvs äldre webläsare.
Förklaring:
<SCRIPT LANGUAGE="JavaScript">
// Här finns den kod som fungerar under alla versioner
</SCRIPT>
<SCRIPT LANGUAGE="JavaScript 1.1">
// Här finns den kod som bara fungerar under 1.1, 1.2 och 1.3
</SCRIPT>
<SCRIPT LANGUAGE="JavaScript 1.2">
// Här finns den kod som bara fungerar under 1.2 och 1.3
</SCRIPT>
<SCRIPT LANGUAGE="JavaScript 1.3">
// Här finns den kod som bara fungerar under 1.3
</SCRIPT>
Funktioner
Här ska jag lite kort gå igenom funktioner. Funktioner används så
fort man vill skriva ett script på några fler rader.
Du kan t ex tillverka en funktion som heter skriv(). Om du kopplar den
till ett objekt som kallas Penna så blir funktionen till metoden Penna.skriv().
Aningen komplicerat va? Jag ska inte gå in närmare på det, men ville ändå
nämna det.
Jag har gjort ett exempel:
<HTML>
<SCRIPT>
<!--
document.write("Jag tycker den här sidan är väldigt
bra!<BR>");
document.write("Självklart är den det!<p>");
document.write("Jag tycker den här sidan är
väldigt bra!<BR>");
document.write("Självklart är den det!<p>");
document.write("Jag tycker den här sidan är väldigt
bra!<BR>");
document.write("Självklart är den det!<p>");
//-->
</SCRIPT>
</HTML>
Detta gör att texten innanför sitationstecknen ovan kommer att stå 3 gånger
under varann helt enkelt. Med en extra radbrytning mellan varje stycke. Inte
speciellt användbart.
Det man istället kan göra för samma sak är följande:
<HTML>
<SCRIPT>
<!--
function minFunktion(){
document.write("Jag tycker den här sidan är väldigt
bra!<BR>");
document.write("Självklart är den det!<p>");
}
minFunktion();
minFunktion();
minFunktion();
//-->
</SCRIPT>
</HTML>
Här defineras funktionen minFunktion() genom de första raderna i
scriptet. Man kan kalla funktionen vad som helst, t ex hej(), kalle(),
bertil().
Efter första definitionen kommer det en klammer { följt av texten och sedan en
klammer } till som avslutar funktionen.
Varje gång du ska anropa funktionen räcker det med att skriva minFunktion();
så många gånger du vill att texten ska stå, i det här fallet 3 gånger.
Mailscript
Här gör vi en knapp som skickar ett mail (mailto-stilen):
<HTML>
<HEAD>
<TITLE>Maila</TITLE>
</HEAD>
<BODY>
<FORM>
<INPUT TYPE="button" VALUE="Skicka ett mail"
onClick="parent.location='mailto:rajtzing@hotmail.com'"
</FORM>
</BODY>
</HTML>
Detta ser sedan ut så här:
Klocka
Här kommer en användbar klocka:
<HTML>
<HEAD>
<TITLE>Klocka</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
funktion its_showtime(){
nu = new Date();
tim = nu.getHours();
min = nu.getMinutes();
sek = nu.getSeconds();
varde = tim
varde += ((min < 10) ? ":0":":") + min;
varde += ((sek < 10) ? ":0":":") + sek;
setTimeout("its_showtime()",1000);
document.tidig.tid.value = varde;
}
//-->
</SCRIPT>
</HEAD>
<BODY onLoad=its_showtime()">
<H2>Klockan är nu...</H2>
<FORM NAME="tidig">
<INPUT TYPE="text" NAME="tid" SIZE=10
VALUE="">
</FORM>
</BODY>
</HTML>