Événement onload

Événements DOM Objet Event

Définition et utilisation

L'événement onload se produit après que l'objet a été chargé.

L'événement onload est le plus souvent utilisé dans l'élément <body>, pour exécuter les scripts après que le site web ait complètement chargé tous les contenus (y compris les images, les fichiers de scripts, les fichiers CSS, etc.).

L'événement onload peut être utilisé pour vérifier le type et la version du navigateur de l'visiteur et charger la version correcte du site web en fonction de ces informations.

L'événement onload peut également être utilisé pour gérer les cookies (voir les exemples ci-dessous).

Exemple

Exécutez immédiatement JavaScript après le chargement de la page :

<body onload="myFunction()">

Essayez-le vous-même

Exemple 2

Utilisez l'événement onload sur l'élément <img>. Alertez immédiatement après le chargement de l'image :

<img src="w3javascript.gif" onload="loadImage()" width="100" height="132">
<script>
function loadImage() {
  alert("Image is loaded");
}
</script>

Essayez-le vous-même

Exemple 3

Utilisez 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>

Essayez-le vous-même

Syntaxe

Dans HTML :

<element onload="myScript">

Essayez-le vous-même

En JavaScript :

object.onload = function(){myScript};

Essayez-le vous-même

En JavaScript, utilisez la méthode addEventListener() :

object.addEventListener("load", myScript);

Essayez-le vous-même

Remarque :Internet Explorer 8 ou versions antérieures ne supporte pas Méthode addEventListener()。

Détails techniques

Bubbling : Non supporté
Annulable : Non supporté
Type d'événement : Si généré par l'interface utilisateur,UiEvent。 Event。
Supporté HTML tags : <body>, <frame>, <iframe>, <img>, <input type="image">, <link>, <script>, <style>
Version DOM : Événements de niveau 2

Compatibilité navigateur

Événements Chrome IE Firefox Safari Opera
onload Support Support Support Support Support
Événements DOM Objet Event