Ausführliche Erklärung zum HTML5-Webspeicher-H5-Tutorial-php.cn

Ausführliche Erklärung zum HTML5-Webspeicher

巴扎黑

Freigeben： 2017-05-21 14:54:18

Original

1453 Leute haben es durchsucht

Der folgende Editor bietet Ihnen eine detaillierte Erklärung des HTML5-Webspeichers. Der Herausgeber findet es ziemlich gut, deshalb werde ich es jetzt mit Ihnen teilen und es allen als Referenz geben. Kommen Sie und schauen Sie sich den Editor an, ich wünsche Ihnen allen viel Spaß beim Spielen

Speichern von Daten auf dem Client

HTML5 bietet zwei Arten von Daten auf dem Client Neue Möglichkeiten, Daten auf der Client-Seite zu speichern:

• localStorage - keine zeitliche Begrenzung Datenspeicherung

• sessionStorage – Vor der Datenspeicherung für eine Sitzung

wurden diese alle durch Cookies durchgeführt. Cookies eignen sich jedoch nicht zum Speichern großer Datenmengen, da sie bei jeder Anfrage an den Server weitergeleitet werden, was Cookies langsam und ineffizient macht.

In HTML5 werden Daten nicht bei jeder Serveranfrage übergeben, sondern Daten werden nur verwendet, wenn sie angefordert werden. Es ermöglicht die Speicherung großer Datenmengen, ohne die Leistung der Website zu beeinträchtigen.

Für verschiedene Websites werden Daten in unterschiedlichen Bereichen gespeichert und eine Website kann nur auf ihre eigenen Daten zugreifen.

HTML5 verwendet JavaScript zum Speichern und Zugreifen auf Daten.

localStorage-Methode

Die von der localStorage-Methode gespeicherten Daten haben keine zeitliche Begrenzung. Die Daten sind auch nach dem nächsten Tag, der nächsten Woche oder dem nächsten Jahr noch verfügbar.

So erstellen Sie localStorage und greifen darauf zu:

XML/HTML-CodeInhalt in die Zwischenablage kopieren

<!DOCTYPE HTML>
<html>
<body>
<script type="text/javascript">
localStorage.lastname="Smith";   
document.write("Last name: " + localStorage.lastname);   
</script>
</body>
</html>

Nach dem Login kopieren

Das folgende Beispiel zählt, wie oft ein Benutzer eine Seite besucht:

XML/HTML-CodeInhalt in die Zwischenablage kopieren

<!DOCTYPE HTML>
<html>
<body>
<script type="text/javascript">
if (localStorage.pagecount)   
    {   
    localStorage.pagecount=Number(localStorage.pagecount) +1;   
    }   
else   
    {   
    localStorage.pagecount=1;   
    }   
document.write("Visits: " + localStorage.pagecount + " time(s).");   
</script>
<p>刷新页面会看到计数器在增长。</p>
<p>请关闭浏览器窗口，然后再试一次，计数器会继续计数。</p>
</body>
</html>

Nach dem Login kopieren

SessionStorage-Methode

sessionStorage Die Methode speichert Daten für eine Sitzung. Die Daten werden gelöscht, wenn der Nutzer das Browserfenster schließt.

So erstellen Sie einen Sitzungsspeicher und greifen darauf zu:

JavaScript-CodeInhalt in die Zwischenablage kopieren

<!DOCTYPE HTML>   
<html>   
<body>   
<script type="text/javascript">   
sessionStorage.lastname="Smith";   
document.write(sessionStorage.lastname);   
</script>   
</body>   
</html>

Nach dem Login kopieren

Das folgende Beispiel zählt, wie oft ein Benutzer eine Seite in der aktuellen Sitzung besucht:

XML/HTML-Code Inhalt in die Zwischenablage kopieren

<!DOCTYPE HTML>
<html>
<body>
<script type="text/javascript">
if (sessionStorage.pagecount)   
    {   
    sessionStorage.pagecount=Number(sessionStorage.pagecount) +1;   
    }   
else   
    {   
    sessionStorage.pagecount=1;   
    }   
document.write("Visits " + sessionStorage.pagecount + " time(s) this session.");   
</script>
<p>刷新页面会看到计数器在增长。</p>
<p>请关闭浏览器窗口，然后再试一次，计数器已经重置了。</p>
</body>
</html>

Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonAusführliche Erklärung zum HTML5-Webspeicher. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!