Wie kann ich JavaScript-Variablenwerte nach der Seitenaktualisierung beibehalten?

Beibehalten von JavaScript-Variablenwerten bei Seitenaktualisierung

In JavaScript verlieren Variablen normalerweise ihre Werte, wenn die Seite aktualisiert wird. Um diese Einschränkung zu überwinden, können wir die Methoden window.localStorage oder window.sessionStorage nutzen.

window.localStorage

localStorage ermöglicht uns das Speichern von Schlüssel-Wert-Paaren, die bestehen bleiben über Browser-Neustarts hinaus. Es gilt für die gesamte Website, nicht nur für eine einzelne Seite.

Um eine Variable festzulegen, die nach einer Aktualisierung bestehen bleiben soll, verwenden Sie Folgendes:

var someVarName = "value";
localStorage.setItem("someVarKey", someVarName);

Um den beibehaltenen Wert auf einer beliebigen Seite abzurufen, verwenden:

var someVarName = localStorage.getItem("someVarKey");

window.sessionStorage

sessionStorage funktioniert ähnlich wie localStorage speichert Daten jedoch nur so lange, wie die Browser-Registerkarte geöffnet bleibt. Es ist nützlich, um sitzungsspezifische Informationen vorübergehend zu speichern.

Um sessionStorage zu verwenden, ersetzen Sie in den obigen Beispielen localStorage durch sessionStorage.

Überlegungen:

• localStorage und sessionStorage können nur Zeichenfolgen speichern. Um Nicht-String-Werte zu speichern, verwenden Sie JSON.stringify und JSON.parse.
• Es wird empfohlen, eine Bibliothek zu verwenden oder eine eigene Abstraktion zu erstellen, um das Speichern verschiedener Datentypen zu erleichtern.
• Diese Methoden stellen Site bereit -weite Persistenz. Setzen Sie sie mit Bedacht ein, um Unordnung und potenzielle Konflikte zu vermeiden.

Referenzen:

• [DOM Speicher](https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Storage)
• [localStorage](https://developer.moz illa.org/en-US/docs/DOM/Storage#localStorage)
• [JSON](https://developer.mozilla.org/en-US/docs/JSON)
• [Browser Speicherkompatibilität](http://caniuse.com/namevalue-storage)
• [Objekte in HTML5 localStorage speichern](https://www.html5rocks.com/en/tutorials/storage/using-the- storage-api/)

Das obige ist der detaillierte Inhalt vonWie kann ich JavaScript-Variablenwerte nach der Seitenaktualisierung beibehalten?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!