1) Lokalen Speicher verwenden (localStorage):
Greifen Sie über das globale Attribut localStorage auf die lokale Speicherfunktion zu und geben Sie einen SpeicherObjekt, das zum Speichern von String-Paaren in Form von Schlüssel/Wert verwendet wird.
Mitglieder des Storage-Objekts:
clear() – entfernt das gespeicherte Schlüssel/Wert-Paar; >
getItem(key>) – Rufen Sie den mit dem angegebenen Schlüssel verknüpften Wert ab key(< ;index>) – Rufen Sie den Schlüssel der angegebenenIndex-Länge ab. – Geben Sie die Anzahl der gespeicherten Schlüssel/Wert-Paare zurück > removeItem(
set
Item(< ;key> ,aktualisieren seinen Wert
[ ] – Verwenden Sie die Zugriffsform von array, um den mit dem angegebenen Schlüssel
verknüpften Wert zu erhalten. Hören Sie sich das Speicherereignisan : Wenn ein Dokument den lokalen Speicher ändert, wird das Speicherereignis ausgelöst und das zugewiesene Objekt ist ein StorageEvent-Objekt, dessen Mitglieder sind:
key – Rückgabe erfolgt. Geänderter Schlüssel;
oldValue – gibt den alten Wert zurück, der diesem Schlüssel zugeordnet ist.
newValue – gibt den neuen zurück Wert, der diesem Schlüssel zugeordnet ist;
url – Gibt die geänderte Dokument-URL zurück
storageArea – Gibt das geänderte Speicherobjekt zurück; 🎜>
2) Sitzungsspeicher verwenden (
SitzungSpeicher)
Wie Sitzungsspeicher Funktioniert Es kommt dem lokalen Speicher sehr nahe, mit der Ausnahme, dass die Daten für jeden Browserkontext privat sind und beim Schließen des Dokuments entfernt werden.
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>上海远地资产管理有限公司</title> <meta name="author" content="jason"/> <meta name="description" content="上海远地资产管理有限公司(简称:远地资产),是一家专业的互联网金融服务平台."/> <link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon"/> <style type="text/css"> body > *{ float:left; } table{ border-collapse: collapse; margin-left: 50px; } th,td{ padding: 4px; } th{ text-align: right; } input{ border:thin solid black; padding: 2px; } label{ min-width: 50px; display: inline-block; text-align: right; } #countmsg,#buttons{ margin-left: 50px; margin-top:5px; margin-bottom: 5px; } </style> </head> <body> <p> <p> <label>Key:</label> <input id="key" placeholder="Enter Key"> </p> <p> <label>Value:</label> <input id="value" placeholder="Enter Value"> </p> <p id="buttons"> <button id="add">Add</button> <button id="clear">Clear</button> </p> <p id="countmsg">There are <span id="count"></span> items</p> </p> <table id="data" border="1"> <tr> <th>Item Count:</th><td>-</td> </tr> </table> <script> displayData(); var buttons=document.getElementsByTagName("button"); for(var i=0;i<buttons.length;i++){ buttons[i].onclick=handleButtonPress; } function handleButtonPress(e){ switch(e.target.id){ case 'add': var key=document.getElementById("key").value; var value=document.getElementById("value").value; localStorage.setItem(key,value); break; case 'clear': localStorage.clear(); break; } displayData(); } function displayData(){ var tableElem=document.getElementById("data"); tableElem.innerHTML=""; var itemCount=localStorage.length; document.getElementById("count").innerHTML=itemCount; for(var i=0;i<itemCount;i++){ var key=localStorage.key(i); var val=localStorage[key]; tableElem.innerHTML+="<tr><th>"+key+":</th><td>"+val+"</td></tr>"; } } </script> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> table{ border-collapse: collapse; margin-left: 50px; } th,td{ padding: 4px; } </style> </head> <body> <table id="data" border="1"> <tr> <th>key</th> <th>oldValue</th> <th>newValue</th> <th>url</th> <th>storageArea</th> </tr> </table> <script> var tableElem=document.getElementById("data"); window.onstorage=handleStorage; function handleStorage(e){ var row="<tr>"; row+="<td>"+ e.key+"</td>"; row+="<td>"+ e.oldValue+"</td>"; row+="<td>"+ e.newValue+"</td>"; row+="<td>"+ e.url+"</td>"; row+="<td>"+ (e.storageArea == localStorage)+"</td></tr>"; tableElem.innerHTML+=row; } </script> </body> </html>
Das obige ist der detaillierte Inhalt vonEine detaillierte Einführung in die Verwendung von Webspeicher in HTML5. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Der HTML5 -Code besteht aus Tags, Elementen und Attributen: 1. Das Tag definiert den Inhaltstyp und ist von Winkelklammern umgeben, wie z. 2. Elemente bestehen aus Start -Tags, Inhalten und End -Tags wie Inhalten. 3. Attribute definieren Schlüsselwertpaare im Start-Tag und verbessern Funktionen, z. B.. Dies sind die grundlegenden Einheiten zum Aufbau von Webstruktur.

HTML5 ist eine Schlüsseltechnologie zum Aufbau moderner Webseiten und bietet viele neue Elemente und Funktionen. 1. HTML5 führt semantische Elemente wie usw. ein, die die Webseitenstruktur und die SEO verbessern. 2. Support Multimedia-Elemente und Einbetten von Medien ohne Plug-Ins. 3. Formulare verbessern neue Eingangstypen und Überprüfungseigenschaften und vereinfachen Sie den Überprüfungsprozess. 4. Bieten Sie Offline- und lokale Speicherfunktionen an, um die Leistung der Webseiten und die Benutzererfahrung zu verbessern.

Zu den Best Practices für den H5 -Code gehören: 1. Verwenden Sie korrekte DocType -Deklarationen und Zeichenkodierung; 2. Verwenden Sie semantische Tags; 3.. HTTP -Anfragen reduzieren; 4. Verwenden Sie asynchrone Laden; 5. Bilder optimieren. Diese Praktiken können die Effizienz, Wartbarkeit und Benutzererfahrung von Webseiten verbessern.

Webstandards und -technologien haben sich bisher aus HTML4, CSS2 und einfachem JavaScript entwickelt und haben erhebliche Entwicklungen erfahren. 1) HTML5 führt APIs wie Leinwand und Webstorage ein, die die Komplexität und Interaktivität von Webanwendungen verbessern. 2) CSS3 fügt Animations- und Übergangsfunktionen hinzu, um die Seite effektiver zu gestalten. 3) JavaScript verbessert die Entwicklungseffizienz und die Lesbarkeit der Code durch moderne Syntax von Node.js und ES6, wie z. B. Pfeilfunktionen und Klassen. Diese Änderungen haben die Entwicklung von Leistungsoptimierung und Best Practices von Webanwendungen gefördert.

H5 ist nicht nur die Abkürzung von HTML5, sondern auch ein breiteres Ökosystem der modernen Webentwicklungstechnologie: 1. H5 enthält HTML5, CSS3, JavaScript und verwandte APIs und Technologien; 2. Es bietet eine reichhaltigere, interaktive und reibungslose Benutzererfahrung und kann nahtlos auf mehreren Geräten ausgeführt werden. 3. Mit dem H5 -Technologie -Stack können Sie reaktionsschnelle Webseiten und komplexe interaktive Funktionen erstellen.

H5 und HTML5 beziehen sich auf dasselbe, nämlich HTML5. HTML5 ist die fünfte Version von HTML, die neue Funktionen wie semantische Tags, Multimedia -Support, Leinwand und Grafiken, Offline -Speicher und lokaler Speicher bietet, die Ausdrucksfähigkeit und Interaktivität von Webseiten verbessert.

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

Zu den Tools und Frameworks, die in der H5 -Entwicklung gemeistert werden müssen, gehören Vue.js, React und WebPack. 1.Vue.js eignet sich zum Erstellen von Benutzeroberflächen und unterstützt die Komponentenentwicklung. 2. Die Rendern des Seitenrenders über virtuelle DOM optimiert, geeignet für komplexe Anwendungen. 3.Webpack wird zur Modulverpackung und zur Optimierung der Ressourcenlast verwendet.


Heiße KI -Werkzeuge

Undresser.AI Undress
KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover
Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool
Ausziehbilder kostenlos

Clothoff.io
KI-Kleiderentferner

AI Hentai Generator
Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

Heiße Werkzeuge

Senden Sie Studio 13.0.1
Leistungsstarke integrierte PHP-Entwicklungsumgebung

WebStorm-Mac-Version
Nützliche JavaScript-Entwicklungstools

SublimeText3 Mac-Version
Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

DVWA
Damn Vulnerable Web App (DVWA) ist eine PHP/MySQL-Webanwendung, die sehr anfällig ist. Seine Hauptziele bestehen darin, Sicherheitsexperten dabei zu helfen, ihre Fähigkeiten und Tools in einem rechtlichen Umfeld zu testen, Webentwicklern dabei zu helfen, den Prozess der Sicherung von Webanwendungen besser zu verstehen, und Lehrern/Schülern dabei zu helfen, in einer Unterrichtsumgebung Webanwendungen zu lehren/lernen Sicherheit. Das Ziel von DVWA besteht darin, einige der häufigsten Web-Schwachstellen über eine einfache und unkomplizierte Benutzeroberfläche mit unterschiedlichen Schwierigkeitsgraden zu üben. Bitte beachten Sie, dass diese Software

Dreamweaver Mac
Visuelle Webentwicklungstools