Maison  >  Article  >  interface Web  >  Exécuter le script lorsque l'utilisateur navigue sur une page HTML ?

Exécuter le script lorsque l'utilisateur navigue sur une page HTML ?

WBOY
WBOYavant
2023-08-20 13:13:06846parcourir

Exécuter le script lorsque lutilisateur navigue sur une page HTML ?

La tâche que nous devons effectuer dans cet article consiste à exécuter un script lorsqu'un utilisateur accède à une page en HTML.

Nous pouvons effectuer la tâche ci-dessus (exécuter un script lorsqu'un utilisateur accède à une page en HTML) en utilisant "onpageshow Event". Avant de passer aux exemples, examinons la définition et l'utilisation de l'événement onpageshow en HTML. .

Événement HTML onpageshow

L'événement onpageshow en HTML se produit lorsqu'un utilisateur accède à une page Web. Cet événement se produit à chaque fois que la page est chargée.

Grammaire

Ce qui suit est la syntaxe de l'événement onpageshow en HTML -

<element onpageshow = "myScript">

Voici un exemple de la façon dont nous utilisons l'événement onpageshow en HTML, lorsque l'utilisateur accède à une page en HTML.

Exemple 1

Dans l'exemple,

  • Nous utilisons l'événement onpageshow lorsque l'utilisateur accède à une page en HTML.

  • Nous avons écrit une méthode alert() à l'intérieur de la fonction. Ainsi, chaque fois que l'utilisateur essaie d'accéder à une page, l'événement onpageshow sera déclenché.

<!DOCTYPE html>
<html>
<head>
   <title>Execute a script when a user navigates to a page in HTML?</title>
</head>
<body onpageshow="navigate()">
   <h2>Execute a script when a user navigates to a page in HTML?</h2>
   <p><b>Note:</b> The <strong>"onpageshow"</strong> event in HTML will not supported in Internet Explorer 10 and before versions.</p>
   <script>
      function navigate() {
         alert("Welcome to the page!");
      }
   </script>
</body>
</html>

Comme nous pouvons le voir dans le résultat ; lorsque l'utilisateur essaie de naviguer vers une page, une alerte sera affichée sur la fenêtre.

La traduction chinoise de

Exemple 2

est :

Exemple 2

Dans l'exemple ci-dessous,

  • Nous utilisons l'événement onpageshow lorsque l'utilisateur accède à une page en HTML.

  • Nous avons écrit une déclaration d'impression à l'intérieur de la fonction. Ainsi, chaque fois que l'utilisateur essaie d'accéder à une page, l'événement onpageshow sera déclenché.

<!DOCTYPE html>
<html>
<head>
   <title>Execute a script when a user navigates to a page in HTML?</title>
</head>
<body onpageshow="navigate()">
   <h2>Execute a script when a user navigates to a page in HTML?</h2>
   <p><b>Note:</b> The <strong>"onpageshow"</strong> event in HTML will not supported in Internet Explorer 10 and before versions.</p>
   <h2 id="heading"> </h2>
   <script>
      function navigate() {
         document.getElementById("heading").innerHTML = "Welcome to the page!";
      }
   </script>
</body>
</html>

Comme nous pouvons le voir dans le résultat, lorsque l'utilisateur essaie de naviguer vers une page, l'instruction d'impression sera exécutée.

La traduction chinoise de

Exemple 3

est :

Exemple 3

Dans l'exemple ci-dessous,

  • Nous utilisons l'événement onpageshow lorsque l'utilisateur accède à une page en HTML.

  • Nous avons écrit une déclaration d'impression à l'intérieur de la fonction. Ainsi, chaque fois que l'utilisateur essaie d'accéder à une page, l'événement onpageshow sera déclenché.

  • Dans le code ci-dessous ; nous avons écrit "window.onpageshow", ici l'interface de fenêtre représente une fenêtre contenant un document DOM.

<!DOCTYPE html>
<html>
<head>
   <title>Execute a script when a user navigates to a page in HTML?</title>
</head>
<body>
   <h2>Execute a script when a user navigates to a page in HTML?</h2>
   <h3 id="para"></h3>
   <script>
     function Navigate() {
       document.getElementById("para").innerHTML = "Welcome to the page!";
     }
     window.onpageshow = Navigate;
   </script>
</body>
</html>

Comme nous pouvons le voir dans le résultat, lorsque l'utilisateur essaie de naviguer vers une page, l'instruction d'impression sera exécutée.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer