Exemple
Exécuter un script JavaScript immédiatement après une page a été chargée:
<body onload="myFunction()">
Essayez vous - même » Plus "Try it Yourself" - "Try it Yourself" exemples ci - dessous.
Définition et utilisation
L'événement OnLoad se produit lorsqu'un objet a été chargé.
onload est le plus souvent utilisé dans le <body> élément pour exécuter un script une fois par page Web a complètement chargé tout le contenu (y compris les images, les fichiers de script, les fichiers CSS, etc.).
L'événement onload peut être utilisé pour vérifier le type de navigateur du visiteur et la version du navigateur, et charger la bonne version de la page Web sur la base des informations.
L'événement onload peut également être utilisé pour traiter les cookies (voir "More Examples" ci - dessous).
Support du navigateur
un événement | |||||
---|---|---|---|---|---|
onload | Oui | Oui | Oui | Oui | Oui |
Syntaxe
En HTML:
< Essayez vous - même »
JavaScript:
object .onload=function(){ Essayez vous - même »
En JavaScript, en utilisant la addEventListener() méthode:
object .addEventListener("load", myScript );
Essayez vous - même » Note: Le addEventListener() méthode est pas prise en charge dans Internet Explorer 8 et les versions antérieures.
Détails techniques
Bulles: | Non |
---|---|
cancelable: | Non |
Type d'événement: | UIEvent si elles sont générées à partir d'une interface utilisateur, l'événement autrement. |
Pris en charge les balises HTML: | <body>, <frame>, <iframe>, <img>, <input type = "image">, <link>, <script>, <style> |
DOM Version: | Niveau 2 Événements |
autres exemples
Exemple
En utilisant onload sur un <img> élément. Alerte "Image is loaded" L' "Image is loaded" immédiatement après une image a été chargée:
<img src="w3javascript.gif" onload="loadImage()" width="100" height="132">
<script>
function loadImage() {
alert("Image is
loaded");
}
</script>
Essayez vous - même » Exemple
Utilisation de l'événement onload pour traiter les 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>
Essayez vous - même » <Object Event