HTML5-SQLLite连接

1.代码部分（可直接粘贴到html文件中运行）

<body onload="init()">

    姓名：<input type="text" id="name"><br>

    留言：<input type="text" id="memo"><br>

    <input type="button" value="保存" onclick="saveData()">

    <hr>

    <table id="datatable" border="1"></table>

    <p id="msg"></p>

    <script>

    var datatable = null;

    // C:\Users\Administrator\AppData\Local\Google\Chrome\User Data\Default\databases

    var db = openDatabase('MyData', '', 'my database', 2*1024*1024);

    // 初始化数据

    function init(){

        datatable = document.getElementById('datatable');

        showAllData();

    }

    // 展示一行数据

    function showData(row){

        var tr = document.createElement('tr');

        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);

    }

    // 展示所有数据

    function showAllData(){

        db.transaction(function(tx){

            tx.executeSql('create table if not exists MyData(name TEXT,message TEXT, time INTEGER)',[]);

            tx.executeSql('select * from MyData',[],function(tx, rs){

                removeAllData();

                for(var i = 0; i < rs.rows.length; i++){

                    showData(rs.rows[i]);

                }

            })

        })

    }

    // 清空所有数据

    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 = '姓名';

        th2.innerHTML = '留言';

        th3.innerHTML = '时间';

        tr.appendChild(th1);

        tr.appendChild(th2);

        tr.appendChild(th3);

        datatable.appendChild(tr);

    }

    // 增加数据

    function addData(name, message, time){

        db.transaction(function(tx){

            tx.executeSql('insert into MyData values(?,?,?)',[name,message,time],

            function(tx, rs){

                console.log('成功保存数据！');

            },function(tx, error){

                console.log(error.source+"::"+error.message);

            })

        })

    }

    // 保存数据

    function saveData(){

        var name = document.getElementById('name').value;

        var memo = document.getElementById('memo').value;

        var time = new Date().getTime();

        addData(name,memo,time);

        showAllData();

    }

    </script>

</body>