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

Wie kann ich JavaScript-Variablen nach der Seitenaktualisierung behalten?

Linda Hamilton
Freigeben: 2024-11-25 04:59:21
Original
767 Leute haben es durchsucht

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);
Nach dem Login kopieren

Daten abrufen:

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

var someVarName = localStorage.getItem("someVarKey");
Nach dem Login kopieren

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));
Nach dem Login kopieren

Daten später abrufen und analysieren:

var obj = JSON.parse(localStorage.getItem("objKey"));
Nach dem Login kopieren

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!

Quelle:php.cn
Erklärung dieser Website
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
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage