Web SQL資料庫API是一個獨立的規範，在浏覽器層面提供了本地對結構化資料的存儲，已經被很多現代浏覽器支援了。
我們通過一個簡單的例子來了解下如何使用Web SQL API在浏覽器端建立資料庫表并存儲資料。
在浏覽器裡執行這個應用，會建立一個名叫mydb的資料庫，裡面一張名為“user”的資料庫表，并且插入一條記錄進去，然後從資料庫表中讀取中來，列印在浏覽器上。
下面就來分析下這90行代碼。
程式的入口是setupDB這個函數，下面的setInterval起了1個間隔為200毫秒的周期執行函數，為了模拟目前浏覽器除了進行Web SQL資料庫外，還有其他的任務再執行。
setupDB
用promise實作了一個鍊式調用，第九行代碼從語義上來說很容易了解：首先建立資料庫(createDatabase)，然後建立資料庫表(createTable)，然後插入一條記錄到資料庫表裡(insertEntry), 然後馬上把剛才插入表裡的記錄讀出來(readEntry)。最後列印到浏覽器上。
大家看我第16行的_createDatabaseOK的函數延時1秒執行，僅僅是為了示範WebSQL API 異步調用的最佳實踐。
createDatabase函數的第15行，調用了Web SQL API的openDatabase，建立了一個名為mydb的資料庫。openDatabase會傳回一個資料庫句柄，我們儲存在屬性_db裡以便後續使用。
createTable
使用前一步驟得到的資料庫句柄，通過資料庫句柄暴露的API transaction, 執行一個資料庫事務。事務的具體内容是一個SQL語句，通過executeSql調用來建立資料庫表：
create table if not exists user(id unique, user, passwd)
用過JDBC的朋友對這種寫法應該很熟悉。
資料庫表明為user，主鍵為id，有兩個列user和passwd。
insertEntry
在前一步驟中建立的user資料庫表中插入一行記錄，id為1，user值為Jerry，passwd為1234。
insert into user values (1,‘Jerry’,‘1234’)
readEntry
還是通過第一步建立的資料庫句柄_db, 執行一個資料庫事務，内容為SELECT語句，從user表裡讀出所有記錄。
如果想清除掉Web SQL裡的資料庫表，在Chrome開發者工具裡點選Clear storage：
選中您要清除的Storage類型，點“Clear Site Data"即可。