Dieser Artikel stellt hauptsächlich den lokalen Speicher IndexedDB von HTML5 vor, der einen gewissen Referenzwert hat. Jetzt kann ich ihn mit allen teilen, die ihn benötigen.
IndexedDB ist eine Low-Level-API für Kunden. Der Client speichert große Mengen strukturierter Daten (einschließlich Dateien/Blobs). Der folgende Artikel konzentriert sich darauf, Ihnen die relevanten Kenntnisse von IndexedDB für die lokale HTML5-Speicherung näher zu bringen.
IndexedDB ist eine Low-Level-API, die für die clientseitige Speicherung großer Mengen verwendet wird Strukturierte Daten (einschließlich Dateien/Blobs). Die API verwendet Indizes, um eine leistungsstarke Suche dieser Daten zu ermöglichen.
Seit kurzem gibt es eine Geschäftsanforderung, die darin besteht, Daten offline zu speichern und Formulare und Bilder hochzuladen, wenn ein Netzwerksignal vorhanden ist. Also habe ich IndexedDB von HTML5 studiert.
Wenn Sie nur bestimmte Felder speichern müssen, können Sie den lokalen Speicher und den Sitzungsspeicher verwenden. Sobald jedoch große Datenmengen gespeichert sind, erfüllen lokaler Speicher und Sitzungsspeicher die Anforderungen bei weitem nicht mehr. Zu diesem Zeitpunkt wird die Leistungsfähigkeit von IndexedDB zum Ausdruck kommen.
1. Erstellen oder öffnen Sie eine Datenbank
1 2 3 4 |
|
Da indexedDB mit verschiedenen Browsern kompatibel ist, benötigen wir eine gewisse Kompatibilität Funktion muss mit indexedDB kompatibel sein.
2. Rückruffunktion zum Herstellen einer Verbindung zur Datenbank
1 2 3 4 5 6 7 8 9 |
|
Nachdem die Verbindung zur Datenbank hergestellt wurde, wird auf die Anfrage gewartet drei Typen Status:
Erfolg: Datenbank erfolgreich öffnen oder erstellen
Fehler: Datenbank konnte nicht geöffnet oder erstellt werden
upgradeneeded: Datenbank aktualisieren
Der upgradeneeded-Status kann nur überwacht werden, wenn indexedDB eine neue Datenbank erstellt und wenn indexeddb.open(name, version) version (Datenbankversionsnummer) Zustand ändert. Dieser Zustand wird nicht ausgelöst, wenn sich die Versionsnummer nicht ändert. Das Erstellen und Löschen des ObjectStore der Datenbank wird alle unter diesem Listening-Ereignis ausgeführt.
3. ObjectStore erstellen und löschen
In indexedDB ähnelt ObjectStore einer Datenbanktabelle.
1 2 3 4 5 6 7 8 9 10 |
|
Sie können die folgende Methode verwenden, um einen ObjectStore zu erstellen
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
|
4. Datenhinzufügung, -löschung, -änderung und -abfrage
1 2 3 4 5 6 7 8 9 |
|
Datenbankhinzufügung, -löschung und -änderungsabfrage:
1 2 3 4 5 6 7 8 9 10 11 12 13 |
|
Daten nach Index suchen
1 2 3 4 5 6 7 8 9 |
|
Daten nach Indexbereich suchen
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
|
Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er wird für das Studium aller hilfreich sein. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website.
Verwandte Empfehlungen:
Mehrere Speichermethoden von Front-End-HTML5
H5
Analyse der mobilen REM-Layout-Anpassungsmethode für Aktivitätsseiten
H5 horizontale und vertikale Bildschirmerkennungsmethode
Das obige ist der detaillierte Inhalt vonLokaler HTML5-Speicher IndexedDB. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!