HTML5 Web SQL Database 數據庫的使用方法

 HTML5 Web Database 數據庫的使用方法

 
備註:請使用chrome瀏覽器
 
//openDatabase方法打開已經存在的數據庫,如果不存在將會創建一個數據庫,參數分別是 數據庫的名稱,版本,數據庫的描述,和數據大小
        var db = window.openDatabase("mydatabase", "1.0", "我的數據庫描述", 20000);
數據庫的SQL語句的使用方法
 
dbname.transaction(function (tx) {
            tx.executeSql(sql);
        });
 

 

 

  1. <!DOCTYPE html> 
  2. <html xmlns="http://www.w3.org/1999/xhtml"> 
  3. <head> 
  4.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
  5.     <title></title> 
  6.     <style type="text/css"> 
  7.          
  8.     </style> 
  9. </head> 
  10. <body> 
  11.     <div> 
  12.     </div> 
  13.     <script type="text/javascript"> 
  14.         //openDatabase方法打開已經存在的數據庫,如果不存在將會創建一個數據庫 
  15.         var db = window.openDatabase("mydatabase", "1.0", "我的數據庫描述", 20000); 
  16.         var d = new Date(); 
  17.  
  18.         //創建數據表 
  19.         var sql = "CREATE TABLE mytable (mytitle TEXT, timestamp REAL)"
  20.         db.transaction(function (tx) { 
  21.             tx.executeSql(sql); 
  22.         }); 
  23.         //往數據表插入數據 
  24.         db.transaction(function (tx) { 
  25.             tx.executeSql("INSERT INTO mytable (mytitle, timestamp) values(?, ?)", ["廣州大學華軟軟件學院3", d.toLocaleString()], null, null); 
  26.         }); 
  27.         //刪除數據表 
  28.         //db.transaction(function (tx) { 
  29.         //   tx.executeSql("DROP TABLE mytable "); 
  30.         //}); 
  31.         db.transaction(function (tx) { 
  32.             tx.executeSql("SELECT * FROM mytable", [], 
  33.                  function (tx, result) { 
  34.                      for (var i = 0; i < result.rows.length; i++) { 
  35.                          document.write('<h1>' + 
  36.         result.rows.item(i)['mytitle'] + " " + 
  37.             result.rows.item(i)['timestamp'] + 
  38.         '</h1>'); 
  39.                      } 
  40.                  }, 
  41.                         function () { 
  42.                             alert("error"); 
  43.                         }); 
  44.         }); 
  45.  
  46.     </script> 
  47.  
  48. </body> 
  49. </html> 
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章