Ejemplos de uso de la base de datos IndexedDB en HTML5

En el almacenamiento local de HTML5, hay una base de datos llamada IndexedDB. Desde la parte anterior: Serie avanzada HTML5: almacenamiento web, sabemos que el almacenamiento web puede acceder fácilmente a datos simples en el acceso local, pero para una gran cantidad de almacenamiento estructurado, las ventajas de indexedB son aún más obvias. A continuación, echemos un vistazo a cómo IndexedDB almacena los datos.

Un sitio web puede tener múltiples bases de datos IndexedDB, pero el nombre de cada base de datos es único. Necesitamos conectar una base de datos específica a través del nombre de la base de datos.

 Var Research = indexeddb.open ('dbname', 1);/ Abra la base de datos dbname. } Solicitud.

Utilizamos el método indexedDB.open para conectar la base de datos. Este método devolverá un objeto IDBOPENDBREQUEST para representar un objeto de solicitud que solicita una base de datos. Podemos definir el método donde la conexión es exitosa o no se ejecuta al monitorear los eventos ONSUCCCESS y OnError del objeto de solicitud.

Debido a que el almacén de datos en la base de datos no permite que el almacén de la base de datos cambie en la misma versión, se requiere el nuevo número de versión para actualizar la versión en el método indexedDB.open para evitar modificarse repetidamente la base de datos en la misma versión. ¡El número de versión debe ser un entero!

 var investigación = indexeddb.open ('dbname', 2); is = is = is = = ' + e.newversion);}

Definimos el método ejecutado cuando la versión de la base de datos se actualiza al monitorear el evento OnUpgradeneeded del objeto de solicitud.

Después de usar indexedb.open para conectarse al éxito de la base de datos, se devolverá un objeto IDBOpendBrequest.

 Var Research = indexeddb.open ('dbname', 2); Close ();

 indexeddb.deletedatabase ('dbname');

El almacén de objetos es la base de la base de datos IndexedDB.

 Var Research = indexeddb.open ('dbname', 3); 'UserId', Autoincrement: False});

DB.CreateObjectStore Method recibe dos parámetros. La propiedad del teclado en este objeto es la clave principal, que es equivalente a la ID en la tabla de la base de datos como la clave principal. El atributo AutoiIncrement es falso, lo que significa que el valor clave principal no aumenta por sí mismo.

Nota: En la base de datos, el nombre del almacén de objetos no se puede repetir, de lo contrario, el navegador informará un error.

En la base de datos IndexedDB, se crea un índice a través de un cierto atributo del objeto de datos.

 Var Research = indexeddb.open ('dbname', 4); 'UserID', AutoIncrement: False});

El método Store.CreateIndex recibe tres parámetros. El valor es un objeto JS. La propiedad única en este objeto es verdadera, lo que significa que el valor del índice no puede ser el mismo, es decir, el nombre de usuario de los dos datos no puede ser el mismo, y el falso puede ser el mismo.

En IndexedDB, todas las operaciones de datos solo se pueden realizar en los asuntos. Después de que la base de datos sea exitosa, puede usar el método de transacción del objeto IDBOpendBRequest para abrir solo las transacciones de lectura o lectura y escritura.

 Var Research = indexeddb.open ('dbname', 5); tx.oncomplete = function (e) {console.log ('la transacción ha terminado');} tx.onabort = function (e) {console.log ('la transacción ha sido suspendida');}}

El método DB.TRANSACTION recibe dos parámetros. El segundo parámetro es el modo de transacción. Se puede transmitir a la ReadWrite para operaciones de lectura y escritura.

1. Agregar (): Agregar datos. Reciba un parámetro al objeto que debe almacenarse en el almacén de objetos.
2. put (): Agregar o modificar datos. Reciba un parámetro al objeto que debe almacenarse en el almacén de objetos.
3. Get (): Obtener datos. Reciba un parámetro al valor clave principal que debe obtenerse.
4. Eliminar (): eliminar los datos. Reciba un parámetro al valor clave principal que debe obtenerse.

 Var Research = indexeddb.open ('dbname', 5); ',', ',' ReadWrite '); valor); eliminar (1); / Eliminar los datos de los datos del índice 1 }}}}}}

El papel de agregar y poner es similar. y use Agregar para guardar los datos.

Sabemos que anteriormente puede obtener datos utilizando el método get (), pero el valor clave principal es necesario. Si queremos obtener una variedad de datos, podemos usar un cursor. El cursor fue creado y abierto por el método OpenCursor del almacén de objetos.

El método OpenCursor recibe dos parámetros.

 // BoundRange representa una colección de valores de clave primarios de 1 a 10 (incluidas 1 y 10). // Si el tercer parámetro es verdadero, significa que el valor de clave mínimo no es 1. Si el cuarto parámetro es verdadero, significa que no contiene el valor de clave máximo 10, y el valor predeterminado es falseVar BoundRange = IdbKeyRande.Bound (1, 10, falso falso, falso); El único parámetro () es el valor clave principal, un tipo entero. VarmingRange = IDBKEyRange.Oldly (1); // El segundo parámetro es opcional, lo que significa que verdadero no incluye la clave primaria mínima 1, False se incluye y el valor predeterminado a FALSEVAR LOGERRANGE = IDBKEYRANGE. del valor clave principal de menos de 10 esencia // El segundo parámetro es opcional, lo que significa que True no incluye la clave primaria más grande 10, y False incluye, y el valor predeterminado es falseVar upperRange = idbkeyRange.UpeperBound (10, falso);

El segundo parámetro del método de opencursor representa la dirección de lectura del cursor.

1. Siguiente: Los datos en el cursor se organizan de acuerdo con el valor de la clave principal.
2. NextUnique: los datos en el cursor se organizan de acuerdo con el valor de la clave principal.
3. Anterior: Los datos en el cursor se organizan de acuerdo con el valor principal del valor clave principal.
4. Previamente: los datos en el cursor están organizados por el valor clave principal.

 Var Research = indexeddb.open ('dbname', 6); ',', ',', 'ReadWrite'); ; }

Cuando hay datos que cumple con las condiciones de búsqueda, puede actualizar los datos a través del método de actualización:

 Cursor.updata ({userId: cursor.key, nombre de usuario: 'hola', edad: 18});

Estos datos se pueden eliminar a través del método Eliminar:

 cursor.delete ();

Puede continuar leyendo los siguientes datos a través del método Constinue, de lo contrario, no continuará leyendo después de leer el primer dato:

 cursor.continue ();

Desde la conexión de bases de datos, creando almacenes de objetos, índices, hasta datos de operación y recuperación, complete el proceso completo de datos de acceso indexadoDDB. A continuación, a través de un ejemplo completo para comprender mejor la base de datos indexedDB. Dirección del código: indexeddb-demo

Lo anterior es todo el contenido de este artículo.