<!doctype html>

<html>

    <head>

        <meta charset="utf-8">

        <script>

        window.onload = function () {

            var one = document.getElementById('one');

            if (window.openDatabase) {

                var dataBase = openDatabase("student", "1.0", "学生表", 1024*1024, function() {

                });

                dataBase.transaction(function (fx) {

                    //创建一个表

                    fx.executeSql(

                        "create table if not exists stu (id REAL UNIQUE, name TEXT)",

                        [],

                        function () {  //表创建成功

                            alert("表创建成功");

                        },

                        function () {  //表创建失败

                            alert("表创建失败");

                        }

                    );

                    //插入数据

                    fx.executeSql(

                        "insert into stu (id, name) values(?, ?)",

                        [1, "张三"],

                        function () {  //表创建成功

                            alert("数据插入成功");

                        },

                        function () {  //表创建失败

                            alert("数据插入失败");

                        }

                    );

                    //更新数据

                    fx.executeSql(

                        "update stu set name = ? where id = ?",

                        ["李四", 1],

                        function () {  //表创建成功

                            alert("数据更新成功");

                        },

                        function () {  //表创建失败

                            alert("数据更新失败");

                        }

                    );

                    //查询数据

                    fx.executeSql(

                        "select * from stu",

                        [],

                        function (fx, result) {  //表创建成功

                            // alert(result.rows.length);

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

                                one.innerHTML = result.rows.item(i)['name'];

                            }

                            alert("数据查询成功");

                        },

                        function () {  //表创建失败

                            alert("数据查询失败");

                        }

                    );

                    //删除数据

                    fx.executeSql(

                        "delete from stu where id=?",

                        [1],

                        function (fx, result) {  //表创建成功

                            one.innerHTML = "";

                        },

                        function () {  //表创建失败

                            alert("删除失败");

                        }

                    );

                    //删除表

                    fx.executeSql(

                        "drop table stu",

                        [],

                        function (fx, result) {  //表创建成功

                            alert("表删除成功");

                        },

                        function () {  //表创建失败

                            alert("表删除失败");

                        }

                    );

                })

            }

        }

        </script>

    </head>

    <body>

        <p id="one">测试</p>

    </body>

</html>

html ---- web sql 例子的更多相关文章

  1. HTML5本地存储——Web SQL Database

    在HTML5 WebStorage介绍了html5本地存储的Local Storage和Session Storage,这两个是以键值对存储的解决方案,存储少量数据结构很有用,但是对于大量结构化数据就 ...

  2. [转]HTML5本地存储——Web SQL Database

    在HTML5 WebStorage介绍了html5本地存储的Local Storage和Session Storage,这两个是以键值对存储的解决方案,存储少量数据结构很有用,但是对于大量结构化数据就 ...

  3. (转)HTML 5离线存储之Web SQL

    原文:http://developer.51cto.com/art/201106/267357.htm HTML 5离线存储之Web SQL 2011-06-07 15:14 kkun kkun的博客 ...

  4. HTML5本地存储——Web SQL Database与indexedDB

    虽然在HTML5 WebStorage介绍了html5本地存储的Local Storage和Session Storage,这两个是以键值对存储的解决方案,存储少量数据结构很有用,但是对于大量结构化数 ...

  5. 关于web浏览器的Web SQL和IndexedDB

    虽然在HTML5 WebStorage介绍了html5本地存储的Local Storage和Session Storage,这两个是以键值对存储的解决方案,存储少量数据结构很有用,但是对于大量结构化数 ...

  6. Web SQL与indexedDB

    虽然在HTML5 WebStorage介绍了html5本地存储的Local Storage和Session Storage,这两个是以键值对存储的解决方案,存储少量数据结构很有用,但是对于大量结构化数 ...

  7. HTML5教程之html 5 本地数据库（Web Sql Database）

    HTML5的Web SQL Databases(html5 本地数据库)的确很诱惑人,当你发现可以用与mysql查询一样的查询语句来操作本地数据库时,你会发现这东西挺有趣的.今天,我们一起来了解HTM ...

  8. HTML5 学习笔记（三）——本地存储(LocalStorage、SessionStorage、Web SQL Database)

    一.HTML4客户端存储 B/S架构的应用大量的信息存储在服务器端,客户端通过请求响应的方式从服务器获得数据,这样集中存储也会给服务器带来相应的压力,有些数据可以直接存储在客户端,传统的Web技术中会 ...

  9. web sql database数据存储位置

    Q1: 数据存储在哪儿? Web Storage / Web SQL Database / Indexed Database 的数据都存储在浏览器对应的用户配置文件目录(user profile di ...

随机推荐

  1. spring集成PHPRPC及使用

    PHPRPC,它的商业版本是Hprose.这里仅记录其使用方法.其它相关内容可自行搜索. 对于开源的东西,建议大家看看其源码. 1.需要引入的jar包:phprpc_spring.jar,http:/ ...

  2. iOS 原生二维码扫描和生成

    代码地址如下:http://www.demodashi.com/demo/12551.html 一.效果预览: 功能描述:WSLNativeScanTool是在利用原生API的条件下封装的二维码扫描工 ...

  3. mongoDB 索引的用法

    http://www.cnblogs.com/lipan/archive/2011/03/28/1997202.html MongoDB中的索引其实类似于关系型数据库,都是为了提高查询和排序的效率的, ...

  4. 正则化--Lambda

    模型开发者通过以下方式来调整正则化项的整体影响:用正则化项的值乘以名为 lambda(又称为正则化率)的标量.也就是说,模型开发者会执行以下运算: $$\text{minimize(Loss(Data ...

  5. memcache和memcached区别

    Memcache是一个自由和开放源代码.高性能.分配的内存对象缓存系统.用于加速动态web应用程序,减轻数据库负载.它可以应对任意多个连接,使用非阻塞的网络IO.由于它的工作机制是在内存中开辟一块空间 ...

  6. PHP之十六个魔术方法详细介绍

    PHP中把以两个下划线__开头的方法称为魔术方法(Magic methods),这些方法在PHP中充当了举足轻重的作用.这里进行详细介绍,感兴趣的小伙伴们可以参考一下. PHP中把以两个下划线__开头 ...

  7. Android模拟屏幕点击input tap替代解决方案

    动机解释 本来直接使用 adb shell -> input 即可模拟 键盘事件,触屏事件keyevent ,text,tap 但是手上的这台目标Android机4.0.3系统的input只支持 ...

  8. 在多点环境下使用cas实现单点登陆及登出

    CAS 介绍 CAS 是 Yale 大学发起的一个开源项目,旨在为 Web 应用系统提供一种可靠的单点登录方法,CAS 在 2004 年 12 月正式成为 JA-SIG 的一个项目.CAS 具有以下特 ...

  9. jquery简洁遮罩插件

    /************************** *Desc:提交操作时遮罩 *Argument:type=0 全屏遮 1局部遮 *Author:Zery-Zhang *Date:2014-09 ...

  10. 2016 acm香港网络赛 B题. Boxes

    原题网址:https://open.kattis.com/problems/boxes Boxes There are N boxes, indexed by a number from 1 to N ...