文档分值:17

html >>> html >>> 存储类API

课程目录

基础
格式
表单
框架
图像
音频/视频
链接
列表
表格
样式
元信息
编程
图形与交互类API
计算类API
硬件相关API
通讯类API
存储类API
其它杂项API
字符集与编码
websql

HTML5 Web SQL

Html5数据库API是以一个独立规范形式出现,它包含三个核心方法:

openDatabase:这个方法使用现有数据库或创建新数据库创建数据库对象。

openDatabase方法可以打开已经存在的数据库,不存在则创建:

var    db    =    openDatabase('mydatabase',    '2.0',    my    db',    2    *    1024);

openDatabasek中五个参数分别为:数据库名、版本号、描述、数据库大小、创建回调。创建回调没有也可以创建数据库。

transaction:这个方法允许我们根据情况控制事务提交或回滚。

database.transaction()函数用来查询:

        db.transaction(function    (tx)    {                
        });

executeSql:这个方法用于执行真实的SQL查询。

        tx.executeSql('CREATE    TABLE    IF    NOT    EXISTS    t1    (id    unique,    log)');        

实例

<!DOCTYPE    HTML>    
<html>    
<head>    
<script    type="text/javascript">    
var    db    =    openDatabase('mydb',    '1.0',    'Test    DB',    2    *    1024    *    1024);        
var    msg;        
db.transaction(function    (tx)    {    
        tx.executeSql('CREATE    TABLE    IF    NOT    EXISTS    LOGS    (id    unique,    log)');        
        tx.executeSql('INSERT    INTO    LOGS    (id,    log)    VALUES    (1,    "foobar")');        
        tx.executeSql('INSERT    INTO    LOGS    (id,    log)    VALUES    (2,    "logmsg")');        
        msg    =    '<p>Log    message    created    and    row    inserted.</p>';        
        document.querySelector('#status').innerHTML    =        msg;        
});        

db.transaction(function    (tx)    {    
        tx.executeSql('SELECT    *    FROM    LOGS',    [],    function    (tx,    results)    {    
            var    len    =    results.rows.length,    i;        
            msg    =    "<p>Found    rows:    "    +    len    +    "</p>";        
            document.querySelector('#status').innerHTML    +=        msg;        
            for    (i    =    0;    i    <    len;    i++){    
                    msg    =    "<p><b>"    +    results.rows.item(i).log    +    "</b></p>";        
                    document.querySelector('#status').innerHTML    +=        msg;        
            }    
    },    null);        
});        
</script>    
</head>    
<body>    
<div    id="status"    name="status">Status    Message</div>    
</body>    
</html>

[ 该条目创建时间:2016-06-25 17:18:53 ]