H5 Operation Websql Database

HTML code:

<! DOCTYPE html>
　　
JS Code:
/** * HTML5 Operation local WEBSQL database * Wang * time: 2017/08/26 15:03:19 */var datatable = Null;var db = OpenDatabase ("MyData", "", "My Dat Abase ", 1024 * 100);//Initialize function method function init () {datatable = document.getElementById (" DataTable "); ShowAllData ();} First, remove the Clutter function Removealldata () {for (var i = datatable.childnodes.length-1; I >= 0; i--) {Datatable.removechild (Datatable.childnodes[i]);} var tr = document.createelement ("tr"), var Th1 = document.createelement ("th"); var Th2 = document.createelement ("th"); var Th3 = document.createelement ("th"); th1.innerhtml = "name"; th2.innerhtml = "message"; th3.innerhtml = "Time"; Tr.appendchild (Th1); Tr.appendchild (Th2); Tr.appendchild (TH3);d atatable.appendchild (tr);} Displays data function ShowData (row) {var tr = document.createelement ("tr") in Websql, var td1 = document.createelement ("TD"); td1.innerhtml = Row.name;var TD2 = document.createelement ("TD"); td2.innerhtml = Row.message;var Td3 = Document.createelement ("TD"); var t = new Date (); T.settime (row.time); td3.innerhtml = T.tolocaledatEstring () + "" + t.tolocaletimestring (); Tr.appendchild (TD1); Tr.appendchild (TD2); Tr.appendchild (TD3); Datatable.appendchild (tr);} Displays all data function ShowAllData () {Db.transaction (function (TX) {tx.executesql ("CREATE TABLE IF not EXISTS msgdata (name Text,message text,time INTEGER) ", []); Tx.executesql (" Select * from Msgdata ", [], Function (TX, RS) {removealldata (); for ( var i = 0; i < rs.rows.length; i++) {ShowData (Rs.rows.item (i)}})})}//Add Data function addData (name, message, time) {db.transaction (function (TX) { Tx.executesql ("INSERT into Msgdata VALUES (?,?,?)", [Name, message, time], function (TX, RS) {alert ("message succeeded!") },function (TX, error) {alert (Error.source + "::" + error.message);})})} Call Function SaveData () {var name = document.getElementById ("name"). Value;var Memo = document.getElementById ("Memo"). Value;var time = new Date (). GetTime (); AddData (name, memo, time); ShowAllData ();
　　
H5 Operation Websql Database