4.1 Browserobjekter
Som du allerede ved, fungerer JavaScript-sproget inde i browseren, så det skal på en eller anden måde interagere med den samme browser. For at gøre dette har browseren flere objekter og funktioner, der er tilgængelige fra JavaScript.
Den første er an object window
, som beskriver browservinduet. Eller rettere, jeg plejede at beskrive, hvornår browsere var uden faner. Nu beskriver vinduesobjektet den aktuelle browserfane, hvor siden med scriptet er indlæst.
For det andet er det an object document
den, der er ansvarlig for det dokument, der vises i fanen. Dette kan være lidt forvirrende. Lad os for nemheds skyld sige, at dokumentet er det, der vises for brugeren, og vinduet er, hvad dette dokument vises i.
For det tredje er dette an object console
den, der er ansvarlig for outputtet til browserkonsollen. Ja, browsere har også en konsol, den bruges hovedsageligt til at fejlfinde scriptet og vise fejlmeddelelser. Du kan normalt åbne den ved at trykke på F12-knappen i din browser.
Object window
, er objektet på øverste niveau for alle sideobjekter. Og selvom du direkte kan skrive objektnavne document
i console
dit script, er deres navne window.document
og window.console
.
4.2 Dialoger i JavaScript
alert() metode
Det an object window
har også flere funktioner, der er synlige for sidescriptet. Den mest brugte er alert()
. Det giver dig mulighed for at vise en dialogboks med en besked til brugeren. Scriptet suspenderes derefter, indtil brugeren klikker på OK.
Eksempel:
alert("JavaScript is the best!");
prompt() metode
Der er også en funktion, hvormed du kan bede brugeren om at indtaste en eller anden værdi - det er prompt()
.
Eksempel:
var age = prompt("Enter Year of Birth");
bekræfte() metode
Du kan vise en dialogboks med to knapper Ok
- Cancel
spørg brugeren om en handling.
Eksempel:
var isOK = confirm("Are you ready");
4.3 onload() hændelse
Og endnu et nyttigt og interessant øjeblik. Browservinduet har en hændelse , der udløses, når dokumentet er fuldt indlæst. Du kan angive kode, der skal udføres, efter at dokumentet er indlæst og vist.
Dette kan gøres på tre måder.
For det første kan du indlejre JavaScript-kode direkte på en HTML-side som en attributværdi:
<body onload="alert('document loaded');">
<img src="big-image.png">
</body>
For det andet kan du indlejre JavaScript-kode simpelthen i en HTML-side:
<head>
<script>
function load()
{
alert('document loaded');
}
window.onload = load;
</script>
</head>
<body>
<img src="big-image.png">
</body>
For det tredje kan vi skrive det lidt kortere ved at erklære en anonym funktion:
<head>
<script>
window.onload = function () {
alert('document loaded');
}
</script>
</head>
<body>
<img src="big-image.png">
</body>
4.4 onclick() hændelse
Og endelig er en anden vigtig begivenhed (begivenhed) event OnClick
. Hvilket forekommer på ethvert element, som brugeren klikkede på. Ligesom event OnLoad
det kan indstilles på forskellige måder, så giver vi kun den enkleste:
<body>
<img src="big-image.png" onclick="alert('user clicked on the image');">
</body>
GO TO FULL VERSION