<!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. Javascript 客户端实时显示服务器时间

    <!doctype html> <html lang="zh-cn"> <head> <meta charset="utf-8& ...

  2. xpinyin-函数返回多个值-lambda匿名函数-列表生成式-三元表达式

    import xpinyinp=xpinyin.Pinyin() #实例化print(p.get_pinyin('小白','')) 函数返回多个值:1.函数如果返回多个值的话,它会把这几个值放到一个元 ...

  3. C#实现发送手机短信

  4. ASP.NET CORE RAZOR :将搜索添加到 Razor 页面应用

    https://docs.microsoft.com/zh-cn/aspnet/core/tutorials/razor-pages/search 本文档中,将向索引页面添加搜索功能以实现按“流派”或 ...

  5. 基于多输出有序回归的年龄识别(CVPR_2016)

    作为学习记录,将所做PPT摘录如下: 网络结构: 网络结构描述: 网络工作流程: 损失函数计算: 亚洲人脸数据集: 参考代码:

  6. linux下的3种DDOS软件介绍

    什么是TFN2K? TFN2K 的作者是著名的德国黑客mixter. http://mixter.void.ru/papers.html TFN2K通过主控端利用大量代理端主机的资源进行对一个或多个目 ...

  7. SpringCloud系列二:硬编码实现简单的服务提供者与服务消费者

    从本文开始,以一个电影售票系统为例讲解Spring Cloud 1. 版本 jdk:1.8 SpringBoot:2.0.0.RELEASE SpringCloud:Finchley.M8 2. 系统 ...

  8. shell中的括号作用

    一.小括号,圆括号() 1.单小括号 ()    ①命令组.括号中的命令将会新开一个子shell顺序执行,所以括号中的变量不能够被脚本余下的部分使用.括号中多个命令之间用分号隔开,最后一个命令可以没有 ...

  9. Java内存模型FAQ(一) 什么是内存模型

    原文:http://www.cs.umd.edu/~pugh/java/memoryModel/jsr-133-faq.html 第一章 译者:方腾飞 在多核系统中,处理器一般有一层或者多层的缓存,这 ...

  10. oracle中的minus数据比对

    1.要有唯一索引或者主键作为前提,减少数据冲突的数量,如示例标红的地方:   2.当有in查询的时候,尽量用exists,这样能提高查询效率: create table TF_F_USER_DIFF1 ...