Wie übergebe ich Variablen sicher zwischen HTML-Seiten mit JavaScript?

Variablen zwischen HTML-Seiten mit JavaScript übergeben

In der Webentwicklung ist es oft notwendig, Daten zwischen zwei HTML-Seiten zu übertragen. Ein gängiger Ansatz besteht darin, mithilfe von JavaScript Daten in einer globalen Variablen zu speichern und auf der zweiten Seite abzurufen. Bei dieser Methode können jedoch Probleme auftreten, wenn die globale Variable nicht ordnungsgemäß deklariert oder nicht ordnungsgemäß darauf zugegriffen wird.

Stellen Sie sich das folgende Szenario vor:

• Sie haben zwei Seiten, „Seite 1“ und „Seite 2".
• Auf Seite 1 enthält ein Textfeld einen Wert (z. B. 100).
• Beim Klicken auf eine Schaltfläche speichert JavaScript den Textfeldwert in einer globalen Variablen und leitet zu Seite 2 weiter.
• Auf Seite 2 versucht eine Onload-Funktion, den auf Seite 1 gespeicherten Wert abzurufen und anzuzeigen.

Die Onload-Funktion gibt jedoch immer „undefiniert“ für die globale Variable zurück.

Lösung mit lokalem Speicher

Um dieses Problem zu lösen, besteht ein alternativer Ansatz in der Verwendung von localStorage. Lokaler Speicher bietet eine zuverlässigere und sicherere Möglichkeit zum Speichern und Abrufen von Daten.

• Auf Seite 1:

  Speichern Sie den Textfeldwert in localStorage mit die setItem()-Methode wie folgt:

  <code class="javascript">window.onload = function() {
    var getInput = prompt("Hey type something here: ");
    localStorage.setItem("storageName", getInput);
  }</code>

• Auf Seite 2:

  Rufen Sie den gespeicherten Wert aus localStorage mit getItem( )-Methode und zeigen Sie sie mit warning() an, wie unten gezeigt:

  <code class="javascript">window.onload = function() {
    alert(localStorage.getItem("storageName"));
  }</code>

Durch die Verwendung von localStorage können Sie die konsistente Speicherung und den Abruf von Daten zwischen verschiedenen HTML-Seiten sicherstellen. Dieser Ansatz ist sowohl zuverlässig als auch effizient.

Das obige ist der detaillierte Inhalt vonWie übergebe ich Variablen sicher zwischen HTML-Seiten mit JavaScript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!