onload- Ereignis
Beispiel
Führen Sie ein JavaScript sofort aus, nachdem eine Seite geladen wurde:
<body onload="myFunction()">
Weitere „Probieren Sie es selbst“-Beispiele weiter unten.
Definition und Verwendung
Das onload-Ereignis tritt auf, wenn ein Objekt geladen wurde.
onload wird am häufigsten innerhalb des <body>-Elements verwendet, um ein Skript auszuführen, sobald eine Webseite alle Inhalte (einschließlich Bilder, Skriptdateien, CSS-Dateien usw.) vollständig geladen hat.
Das onload-Ereignis kann verwendet werden, um den Browsertyp und die Browserversion des Besuchers zu überprüfen und basierend auf den Informationen die richtige Version der Webseite zu laden.
Das onload-Ereignis kann auch verwendet werden, um mit Cookies umzugehen (siehe "Weitere Beispiele" unten).
Browser-Unterstützung
Event | |||||
---|---|---|---|---|---|
onload | Yes | Yes | Yes | Yes | Yes |
Syntax
Im HTML-Format:
<element onload="myScript">
In JavaScript:
object.onload = function(){myScript};
Verwenden Sie in JavaScript die Methode addEventListener():
object.addEventListener("load", myScript);
Hinweis: Die Methode addEventListener() wird in Internet Explorer 8 und früheren Versionen nicht unterstützt.
Technische Details
Bläschen: | Nein |
---|---|
kündbar: | Nein |
Ereignistyp: | UiEvent , wenn es von einer Benutzeroberfläche generiert wird, andernfalls Event . |
Unterstützte HTML-Tags: | <body>, <frame>, <iframe>, <img>, <input type="image">, <link>, <script>, <style> |
DOM-Version: | Ereignisse der Ebene 2 |
Mehr Beispiele
Beispiel
Verwenden von onload für ein <img>-Element. Warnung "Bild wird geladen" unmittelbar nachdem ein Bild geladen wurde:
<img src="w3javascript.gif" onload="loadImage()" width="100" height="132">
<script>
function loadImage() {
alert("Image is loaded");
}
</script>
Beispiel
Verwenden des Onload-Ereignisses zum Umgang mit Cookies:
<body onload="checkCookies()">
<script>
function checkCookies() {
var text = "";
if (navigator.cookieEnabled == true) {
text = "Cookies are enabled.";
} else {
text = "Cookies are not enabled.";
}
document.getElementById("demo").innerHTML = text;
}
</script>