événement de chargement
Exemple
Exécutez un JavaScript immédiatement après le chargement d'une page :
<body onload="myFunction()">
Plus d'exemples "Essayez-le vous-même" 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 l'élément <body> pour exécuter un script une fois qu'une 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 et la version du navigateur du visiteur, et charger la version appropriée de la page Web en fonction des informations.
L'événement onload peut également être utilisé pour traiter les cookies (voir "Plus d'exemples" ci-dessous).
Prise en charge du navigateur
Event | |||||
---|---|---|---|---|---|
onload | Yes | Yes | Yes | Yes | Yes |
Syntaxe
En HTML :
<element onload="myScript">
En Javascript :
object.onload = function(){myScript};
En JavaScript, en utilisant la méthode addEventListener() :
object.addEventListener("load", myScript);
Remarque : La méthode addEventListener() n'est pas prise en charge dans Internet Explorer 8 et les versions antérieures.
Détails techniques
Bulles: | Non |
---|---|
Annulable : | Non |
Type d'événement: | UiEvent s'il est généré à partir d'une interface utilisateur, Event dans le cas contraire. |
Balises HTML compatibles : | <body>, <frame>, <iframe>, <img>, <input type="image">, <link>, <script>, <style> |
Version DOM : | Événements de niveau 2 |
Plus d'exemples
Exemple
Utilisation de onload sur un élément <img>. Alerte "L'image est chargée" immédiatement après le chargement d'une image :
<img src="w3javascript.gif" onload="loadImage()" width="100" height="132">
<script>
function loadImage() {
alert("Image is loaded");
}
</script>
Exemple
Utilisation de l'événement onload pour gérer 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>