Introduction détaillée HTML5 à la base de données Web SQL-Tutoriel H5-php.cn

Introduction détaillée HTML5 à la base de données Web SQL

黄舟

Libérer： 2017-07-18 14:02:37

original

2264 Les gens l'ont consulté

L'API Web SQL Database ne fait pas partie de la spécification HTML5, mais il s'agit d'une spécification indépendante qui introduit un ensemble d'API permettant d'utiliser SQL pour faire fonctionner les bases de données client.

Méthodes de base

OpenDatabase - Créer un objet de base de données en utilisant une base de données existante ou une nouvelle base de données

Transaction - Capable de contrôler une chose , et effectuez une validation ou une restauration en fonction de cette situation

executeSql-exécutez l'instruction SQL réelle

ouvrez la base de données

//用openDatabase()方法打开已存在的数据库，如果数据库不存在，则会创建一个新的数据库
var db = openDatabase(&#39;mydb&#39;, &#39;1.0&#39;, &#39;Test DB&#39;, 2 * 1024 * 1024);

Copier après la connexion

La description des cinq paramètres correspondant à la méthode openDatabase() :

Nom de la base de données
Numéro de version
Texte de description
Taille de la base de données (octets)
Créer un rappel (facultatif)

Le cinquième paramètre, le rappel de création sera appelé après la création de la base de données.

Créer un tableau

var db = openDatabase(&#39;mydb&#39;, &#39;1.0&#39;, &#39;Test DB&#39;, 2 * 1024 * 1024);
db.transaction(function (tx) {  
   tx.executeSql(&#39;CREATE TABLE IF NOT EXISTS LOGS (id unique, log)&#39;);
});

Copier après la connexion

Insérer des données

var db = openDatabase(&#39;mydb&#39;, &#39;1.0&#39;, &#39;Test DB&#39;, 2 * 1024 * 1024);
db.transaction(function (tx) {
   tx.executeSql(&#39;CREATE TABLE IF NOT EXISTS LOGS (id unique, log)&#39;);
   tx.executeSql(&#39;INSERT INTO LOGS (id, log) VALUES (1, "博客园")&#39;);
   tx.executeSql(&#39;INSERT INTO LOGS (id, log) VALUES (2, "www.cnblogs.com")&#39;);
});

Copier après la connexion

Vous pouvez également insérer des données à l'aide de valeurs dynamiques

//e_id 和 e_log 是外部变量，executeSql 会映射数组参数中的每个条目给 "?"
var db = openDatabase(&#39;mydb&#39;, &#39;1.0&#39;, &#39;Test DB&#39;, 2 * 1024 * 1024);
db.transaction(function (tx) {  
  tx.executeSql(&#39;CREATE TABLE IF NOT EXISTS LOGS (id unique, log)&#39;);
  tx.executeSql(&#39;INSERT INTO LOGS (id,log) VALUES (?, ?)&#39;, [e_id, e_log]);
});

Copier après la connexion

Lire les données

var db = openDatabase(&#39;mydb&#39;, &#39;1.0&#39;, &#39;Test DB&#39;, 2 * 1024 * 1024);
 
db.transaction(function (tx) {
   tx.executeSql(&#39;CREATE TABLE IF NOT EXISTS LOGS (id unique, log)&#39;);
   tx.executeSql(&#39;INSERT INTO LOGS (id, log) VALUES (1, "博客园")&#39;);
   tx.executeSql(&#39;INSERT INTO LOGS (id, log) VALUES (2, "www.cnblogs.com")&#39;);
});
 
db.transaction(function (tx) {
   tx.executeSql(&#39;SELECT * FROM LOGS&#39;, [], function (tx, results) {
      var len = results.rows.length;
      msg = "<p>查询记录条数: " + len + "</p>";
      document.querySelector(&#39;#status&#39;).innerHTML +=  msg;
    
      for (i = 0; i < len; i++){
          msg = "<p><b>" + results.rows[i].log + "</b></p>";
      }
    
   }, null);
});

Copier après la connexion

Supprimer des enregistrements

db.transaction(function (tx) {
    tx.executeSql(&#39;DELETE FROM LOGS  WHERE id=1&#39;);
});

Copier après la connexion

La suppression de données peut également être dynamique

db.transaction(function(tx) {
    tx.executeSql(&#39;DELETE FROM LOGS WHERE id=?&#39;, [id]);
});

Copier après la connexion

Mettre à jour les enregistrements

tx.executeSql("UPDATE CC SET logname=&#39;www.baidu.com&#39; WHERE id=2");

Copier après la connexion

La mise à jour des données peut également être dynamique

tx.executeSql("UPDATE CC SET logname=&#39;www.baidu.com&#39; WHERE id=?", [id]);

Copier après la connexion

Remarque : Supprimer et modifier ne peuvent pas être placés dans le même exécutéSql que l'instruction de création de table. Il est préférable de les écrire séparément

Ce qui suit est. base de données construite

HTML5-Web SQL数据库0