Heim Web-Frontend H5-Tutorial Ausführliche Erklärung zum HTML5-Webspeicher

Ausführliche Erklärung zum HTML5-Webspeicher

Feb 10, 2017 am 10:42 AM

Speichern von Daten auf der Client-Seite

HTML5 bietet zwei neue Möglichkeiten, Daten auf der Client-Seite zu speichern:

• localStorage – Datenspeicherung ohne zeitliche Begrenzung

• sessionStorage - Datenspeicherung für eine Sitzung

Früher wurde dies alles durch Cookies erledigt. 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:

<!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:

<!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

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

So erstellen Sie einen SessionStorage und greifen darauf zu:

<!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:

<!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

Der obige Artikel Die detaillierte Erklärung des HTML5-Webspeichers ist der gesamte vom Herausgeber geteilte Inhalt. Ich hoffe, dass er Ihnen eine Referenz geben kann, und ich hoffe, dass Sie die chinesische PHP-Website unterstützen.

Weitere Artikel zu HTML5-Webspeicherdetails finden Sie auf der chinesischen PHP-Website!

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

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

Video Face Swap

Video Face Swap

Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

So führen Sie das H5 -Projekt aus So führen Sie das H5 -Projekt aus Apr 06, 2025 pm 12:21 PM

Ausführen des H5 -Projekts erfordert die folgenden Schritte: Installation der erforderlichen Tools wie Webserver, Node.js, Entwicklungstools usw. Erstellen Sie eine Entwicklungsumgebung, erstellen Sie Projektordner, initialisieren Sie Projekte und schreiben Sie Code. Starten Sie den Entwicklungsserver und führen Sie den Befehl mit der Befehlszeile aus. Vorschau des Projekts in Ihrem Browser und geben Sie die Entwicklungsserver -URL ein. Veröffentlichen Sie Projekte, optimieren Sie Code, stellen Sie Projekte bereit und richten Sie die Webserverkonfiguration ein.

Was genau bedeutet H5 -Seitenproduktion? Was genau bedeutet H5 -Seitenproduktion? Apr 06, 2025 am 07:18 AM

Die Produktion von H5-Seiten bezieht sich auf die Erstellung von plattformübergreifenden kompatiblen Webseiten unter Verwendung von Technologien wie HTML5, CSS3 und JavaScript. Sein Kern liegt im Parsingcode des Browsers, der Struktur-, Stil- und interaktive Funktionen macht. Zu den allgemeinen Technologien gehören Animationseffekte, reaktionsschnelles Design und Dateninteraktion. Um Fehler zu vermeiden, sollten Entwickler debuggen werden. Leistungsoptimierung und Best Practices umfassen Bildformatoptimierung, Anforderungsreduzierung und Codespezifikationen usw., um die Ladegeschwindigkeit und die Codequalität zu verbessern.

So erstellen Sie H5 -Klicksymbol So erstellen Sie H5 -Klicksymbol Apr 06, 2025 pm 12:15 PM

Zu den Schritten zum Erstellen eines H5 -Klicksymbols gehören: Vorbereitung eines quadratischen Quellenbildes in der Bildbearbeitungssoftware. Fügen Sie die Interaktivität in den H5 -Editor hinzu und legen Sie das Klickereignis fest. Erstellen Sie einen Hotspot, der das gesamte Symbol abdeckt. Stellen Sie die Aktion von Klickereignissen fest, z. B. zum Springen zur Seite oder zum Auslösen von Animationen. Exportieren Sie H5 als HTML-, CSS- und JavaScript -Dateien. Stellen Sie die exportierten Dateien auf einer Website oder einer anderen Plattform ein.

Welche Anwendungsszenarien eignen sich für die H5 -Seitenproduktion Welche Anwendungsszenarien eignen sich für die H5 -Seitenproduktion Apr 05, 2025 pm 11:36 PM

H5 (HTML5) eignet sich für leichte Anwendungen wie Marketingkampagnen, Produktdisplayseiten und Micro-Websites für Unternehmenswerbung. Seine Vorteile liegen in plattformartigen und reichhaltigen Interaktivität, aber seine Einschränkungen liegen in komplexen Interaktionen und Animationen, lokalen Ressourcenzugriff und Offline-Funktionen.

Ist die H5-Seitenproduktion eine Front-End-Entwicklung? Ist die H5-Seitenproduktion eine Front-End-Entwicklung? Apr 05, 2025 pm 11:42 PM

Ja, die H5-Seitenproduktion ist eine wichtige Implementierungsmethode für die Front-End-Entwicklung, die Kerntechnologien wie HTML, CSS und JavaScript umfasst. Entwickler bauen dynamische und leistungsstarke H5 -Seiten auf, indem sie diese Technologien geschickt kombinieren, z. B. die Verwendung der & lt; canvas & gt; Tag, um Grafiken zu zeichnen oder JavaScript zu verwenden, um das Interaktionsverhalten zu steuern.

Worauf bezieht sich H5? Erforschen des Kontextes Worauf bezieht sich H5? Erforschen des Kontextes Apr 12, 2025 am 12:03 AM

H5REFERSTOHTML5, ApivotaltechnologyInwebdevelopment.1) HTML5IntroducesNewelementsandapisrich, Dynamicwebapplications.2) ITSUPP ortsmultimediaWitHoutPlugins, BETHINGINGUSEREXPERICERCROSSDEVICES.3) SEMANTICELEMENTSIMPROVEPENTENTENTENTRUCTENTRUCTELUREANDSEO.4) H5'SRespo

So erstellen Sie Popup-Fenster mit H5 So erstellen Sie Popup-Fenster mit H5 Apr 06, 2025 pm 12:12 PM

Die Erstellungsschritte für die Erstellung von Popup-Fenstern in H5: 1. Bestimmen Sie die Auslösermethode (klicken, Zeit, Beenden, Scrollen); 2. Entwurfsinhalt (Titel, Text, Aktionsschaltfläche); 3.. Set Style (Größe, Farbe, Schriftart, Hintergrund); 4. Implementieren Sie Code (HTML, CSS, JavaScript); 5. Test und Bereitstellung.

Was ist die H5 -Programmiersprache? Was ist die H5 -Programmiersprache? Apr 03, 2025 am 12:16 AM

H5 ist keine eigenständige Programmiersprache, sondern eine Sammlung von HTML5, CSS3 und JavaScript zum Erstellen moderner Webanwendungen. 1. HTML5 definiert die Webseitenstruktur und -inhalt und bietet neue Tags und APIs. 2. CSS3 steuert Stil und Layout und führt neue Funktionen wie Animation ein. 3. JavaScript implementiert dynamische Interaktion und verbessert Funktionen durch DOM -Operationen und asynchrone Anfragen.

See all articles