Maison >interface Web >js tutoriel >Comment pouvez-vous conserver les variables JavaScript dans la navigation des pages ?

Comment pouvez-vous conserver les variables JavaScript dans la navigation des pages ?

Patricia Arquette
Patricia Arquetteoriginal
2024-11-18 13:43:02288parcourir

How Can You Preserve JavaScript Variables Across Page Navigation?

Préserver les variables JavaScript au-delà de la navigation dans les pages

Imaginez que vous travaillez sur une application Web dans laquelle vous devez stocker des données qui persistent sur différentes pages . En JavaScript, les variables sont limitées à la page actuelle et sont réinitialisées lors de la navigation. Cela pose un défi lorsque vous souhaitez conserver certaines valeurs sur plusieurs pages.

Une technique pour surmonter ce problème consiste à utiliser la propriété window.name. La propriété window.name est une variable globale qui stocke le nom de la fenêtre ou de l'onglet actuel. En définissant la propriété window.name sur la valeur souhaitée, vous pouvez y accéder depuis n'importe quelle page qui s'ouvre dans la même fenêtre.

Exemple :

Considérez le scénario décrit dans la question d'origine :

  1. Sur la page A, vous définissez window.someVar = 5.
  2. Vous naviguez vers la page B via un lien hypertexte.
  3. Sur la page B, vous pouvez accéder à la valeur de window.someVar en appelant window.someVar.

Limitations :

Bien que l'utilisation de window.name pour conserver les variables JavaScript soit efficace, il est important de noter que cela ne fonctionne que dans la même fenêtre ou le même onglet. Si vous ouvrez une nouvelle fenêtre ou un nouvel onglet, la propriété window.name sera réinitialisée.

Approches alternatives :

Il existe d'autres approches pour conserver les variables JavaScript au-delà de la navigation dans les pages. , tels que :

  • Stockage local : Le stockage local est une API native du navigateur qui vous permet de stocker des données qui persiste au fil des sessions.
  • Cookies : Les cookies sont de petits fichiers texte qui sont stockés sur l'appareil de l'utilisateur et peuvent être utilisés pour stocker des données spécifiques au navigateur.
  • IndexedDB : IndexedDB est une API de base de données Web qui fournit une base de données persistante et sans schéma pour le côté client. candidatures.

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:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn