webSql

http://www.oschina.net/question/12_26204

http://www.silverlightchina.net/html/HTML_5/study/2012/1008/19329.html

https://www.webkit.org/blog/126/webkit-does-html5-client-side-database-storage/

<script>
    // openDatabase
    function initDatabase() {
        try{
            if(!window.openDatabase) {
                alert("Databases are not supported in this browser");
            }else{
                var shortName = "DEMODB";
                var version = "1.0";
                var displayName = "DEMODatabase";
                var maxSize = 100000; // bytes
                DEMODB = openDatabase(shortName, version, displayName, maxSize);
                createTables();
                selectAll();
            }
        }catch(error) {
            alert("error.name: " + error.name);
            alert("error.message: " + error.message);
            alert("error.number: " + error.number);
            alert("error.description: " + error.description);
        }
    }
    
    function createTables() {
        DEMODB.transaction(
            function(transaction) {
                transaction.executeSql("CREATE TABLE IF NOT EXISTS page_settings(id INTEGER NOT NULL PRIMARY KEY, fname TEXT NOT NULL,bgcolor TEXT NOT NULL, font TEXT, favcar TEXT);", [], nullDataHandler, errorHandler);
            }
        );
        prePopulate();
    }
    
    // insert
    function prePopulate() {
        DEMODB.transaction(
            function (transaction) {
                var data = ["1", "none", "#B3B4EF", "Helvetica", "Porsche 911 GT3"];
                
                transaction.executeSql("Insert into page_settings(id, fname, bgcolor, font, favcar) values(?, ?, ?, ?, ?)", [data[0], data[1], data[2], data[3], data[4]]);
            }
        );
    }
    
    function selectAll() {
        DEMODB.transaction(
            function (transaction) {
                transaction.executeSql("select * from page_settings", [], dataSelectHandler, errorHandler);
            }
        );
    }
    
    function dataSelectHandler(transaction, results) {
        for(var i = 0; i < results.rows.length; i++ ) {
            var row = results.rows.item(i);
            var newFeature = new Object();
            newFeature.id = row["id"];
            newFeature.fname = row["fname"];
            newFeature.bgcolor = row["bgcolor"];
            newFeature.font = row["font"];
            newFeature.favcar = row["favcar"];
        }
        for(i in newFeature) {
            alert(newFeature[i]);
        }
    }
    
    function nullDataHandler() {
    }
    
    function errorHandler() {
    }
    
    function updateSetting() {
        DEMODB.transaction(
            function(transaction) {
                var fname = "roboce";
                var bg = "love";
                var font = "lisa";
                var car = "forever";
                transaction.executeSql("update page_settings set fname = ?, bgcolor = ?, font = ?, favcar = ? where id = 1", [fname, bg, font, car]);
            }
        );
    }
    
    function dropTable() {
        DEMODB.transaction(
            function(transaction) {
                transaction.executeSql("drop table page_settings;", [], nullDataHandler, errorHandler);
            }
        );
        
        console.log("Table 'page_settings' has been dropped.");
    }
    
    initDatabase();
    updateSetting();
    dropTable();
</script>