4.1 Webbläsarobjekt
Som du redan vet fungerar JavaScript-språket i webbläsaren, så det måste på något sätt interagera med samma webbläsare. För att göra detta har webbläsaren flera objekt och funktioner som är tillgängliga från JavaScript.
Den första är an object window, som beskriver webbläsarfönstret. Eller rättare sagt, jag brukade beskriva när webbläsare var utan flikar. Nu beskriver fönsterobjektet den aktuella webbläsarfliken där sidan med skriptet laddas.
För det andra är det an object documentden som är ansvarig för dokumentet som visas på fliken. Det här kan vara lite förvirrande. För enkelhetens skull, låt oss säga att dokumentet är det som visas för användaren och fönstret är det som detta dokument visas i.
För det tredje är detta an object consoleden som är ansvarig för utdata till webbläsarkonsolen. Ja, webbläsare har också en konsol, den används främst för att felsöka skriptet och visa felmeddelanden. Du kan vanligtvis öppna den genom att trycka på F12-knappen i din webbläsare.
Object window, är objektet på översta nivån för alla sidobjekt. Och även om du direkt kan skriva objektnamn documenti consoleditt skript, faktiskt deras namn window.documentoch window.console.
4.2 Dialogrutor i JavaScript
alert() metod
Den an object windowhar också flera funktioner som är synliga för sidskriptet. Det vanligaste är alert(). Det låter dig visa en dialogruta med ett meddelande till användaren. Skriptet avbryts sedan tills användaren klickar på OK.
Exempel:
alert("JavaScript is the best!");prompt() metod
Det finns också en funktion med vilken du kan be användaren att ange något värde - det här är prompt().
Exempel:
var age = prompt("Enter Year of Birth");confirm() metod
Du kan visa en dialogruta med två knappar Ok- Cancelfråga användaren om någon åtgärd.
Exempel:
var isOK = confirm("Are you ready");4.3 onload()-händelse
Och ännu ett användbart och intressant ögonblick. Webbläsarfönstret har en händelse som utlöses när dokumentet är helt laddat. Du kan ange kod som ska köras efter att dokumentet har laddats och visats.
Detta kan göras på tre sätt.
Först kan du bädda in JavaScript-kod direkt på en HTML-sida som ett attributvärde:
<body onload="alert('document loaded');">
<img src="big-image.png">
</body>För det andra kan du bädda in JavaScript-kod helt enkelt på en HTML-sida:
<head>
<script>
function load()
{
alert('document loaded');
}
window.onload = load;
</script>
</head>
<body>
<img src="big-image.png">
</body>För det tredje kan vi skriva det lite kortare genom att deklarera 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
Och slutligen, en annan viktig händelse (händelse) är event OnClick. Vilket inträffar på alla element som användaren klickade på. Precis som event OnLoaddet kan ställas in på olika sätt, så ger vi bara det enklaste:
<body>
<img src="big-image.png" onclick="alert('user clicked on the image');">
</body>