Heim  >  Artikel  >  Web-Frontend  >  Wie kann ich JavaScript-Variablen nach der Seitenaktualisierung behalten?

Wie kann ich JavaScript-Variablen nach der Seitenaktualisierung behalten?

Linda Hamilton
Linda HamiltonOriginal
2024-11-25 04:59:21709Durchsuche

How Can I Keep JavaScript Variables After Page Refresh?

JavaScript-Variablen über die Seitenaktualisierung hinaus beibehalten

In JavaScript ist es möglich, Variablen dynamisch durch Schaltflächenklicks oder andere Ereignisse zu ändern. Standardmäßig gehen diese Änderungen jedoch verloren, wenn die Seite aktualisiert wird. Wie können wir sicherstellen, dass Variablen ihre Werte auch nach dem Aktualisieren der Seite behalten?

Lokale und Sitzungsspeicherung

Persistente Speicherung in JavaScript wird durch zwei Methoden erreicht: window.localStorage und window.sessionStorage. Beide bieten eine Möglichkeit zum Speichern von Schlüssel-Wert-Paaren mit geringfügigen Unterschieden:

  • localStorage: Daten bleiben über Browsersitzungen und Neustarts hinweg unbegrenzt erhalten.
  • sessionStorage: Daten bleiben nur während der aktuellen Browsersitzung bestehen und werden gelöscht, sobald das Fenster oder die Registerkarte geschlossen ist geschlossen.

Daten speichern:

Um eine Variable im persistenten Speicher zu speichern, verwenden Sie setItem() mit dem gewünschten Schlüssel und Wert:

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

Daten abrufen:

Nach der Seitenaktualisierung können Sie die gespeicherten Daten mit abrufen getItem():

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

Dadurch wird der gespeicherte Wert someVarName zugewiesen, auch nachdem die Seite aktualisiert wurde.

Einschränkungen überwinden:

Lokaler Speicher und Sitzungsspeicher unterstützen nur Zeichenfolgenwerte. Um komplexere Datentypen zu speichern, sollten Sie die Verwendung von JSON in Betracht ziehen:

var obj = {
  prop1: "value1",
  prop2: "value2"
};

localStorage.setItem("objKey", JSON.stringify(obj));

Daten später abrufen und analysieren:

var obj = JSON.parse(localStorage.getItem("objKey"));

Zusätzliche Ressourcen:

  • Browserspeicher: https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Storage
  • LocalStorage: https://developer.mozilla.org/en-US/docs/DOM /Storage#localStorage

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

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn