189 8069 5689
这篇文章主要介绍HTML5中Web Sql的操作方法，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！
为阳信等地区用户提供了全套网页设计制作服务，及阳信网站建设行业解决方案。主营业务为成都网站设计、网站制作、阳信网站设计，以传统方式定制建设网站，并提供域名空间备案等一条龙服务，秉承以专业、用心的态度为用户提供真诚的服务。我们深信只要达到每一位用户的要求，就会得到认可，从而选择与我们长期合作。这样，我们也可以走得更远！
在web系统或应用中，经常需要在本地存储一些数据，最早的在客户端存储数据用的是cookie(当然cookie主要还是用来保存用户的状态，业余可以干点保存本地数据的活)，事实它并不适合用于保存客户端的本地数据，有以下几个原因：
1、每次请求服务器的时候都会增加不必要的流量消耗，因为每次请求服务器是都会讲cookie发送至服务器。
2、cookie的数据存储数据的规则，并不那么好用，结构也不够清晰。
3、最重要的一点是cookie的存储容量极小，每个cookie的长度不能超过4kb，超过时最早存储cookie的数据会被截掉超出的大小，显然是不太够用的。
随着HTML5的发展，后来又出现了localStorage与sessionStorage：
localStorage：永久存储，无论多久再次进入页面或者页面所在站点（可以使用clearI或removeItem方法删除），都能获取到存储的数据。
sessionStorage：临时存储，当关闭页面的时候会自动清除保存的数据。
事实上在平时工作或开发自己项目的时候，这两个用的是最多，至少目前这两个对象还是可以满足大部分项目本地存储的需求，虽然储存结构依然不够清晰，查询本地存储的数据上依然过于简单。
现在主要是总结一下，HTML5中新增的API-->Web Sql本地数据库技术，Web Sql数据库API实际上不是HTML5规范的组成部分，它是一个独立的规范，它可以使用与sql语言基本一致的语法做到本地数据库的增删改查，所以有后端开发经验的开发者很容易上手（需要指出的是，HTML5已经放弃了Web Sql Database数据库，该规范的指定工作已经停止），即便如此，基本上已经得到了大多数浏览器的支持。现在我们来介绍一下它的使用：
创建一个WebSql数据库：
openDatabase(数据库名，数据库版本号，描述，数据库大小，数据库创建成功的回调);
var mydb = openDatabase('myTeatDatabase',1,'this a Web Sql Database',1024*1024,function(){
//数据库创建成功的回调，可省略
});注：该方法返回一个数据库访问对象，当创建的数据库已经存在的时候，该 方法直接打开这个数据库。
创建一个事务：
mydb.transaction(function(tx){
//该方法有一个事务对象参数供使用，该对象上有一系列为数据库增删改查的方法。
});执行一段操作：
tx.executeSql(执行数据库操作的sql语句，参数，数据库操作执行成功的回调，数据库操作执行失败的回调);
具体的数据库操作：
创建一个数据表：
tx.executeSql('create table if not exists table1 (id unique,name)', [], function(tx, result) {
//成功回调
}，function(error){
//失败回调
});注：这条语句的意思是创建一个数据表table1，当数据库中不存在这张表的时候，如果语句中不加上"if not exists"的话，当想要创建的数据表在数据库中已经存在的时候会报错。
删除一个数据表：
tx.exexcteSql('drop table table1',[],function(tx,result){
//删除成功时的回调
}，function(error){
//删除失败时的回调
});在数据表中添加一条数据：
tx.executeSql('insert into table1 (id,name) values (1,'小明')',[],function(tx,result){
//添加数据成功时的回调
}，function(error){
//添加数据失败时的回调
});删除数据表中的一条或多条数据：
tx.executeSql('delete from table1 where id=1',[],function(tx,result){
//删除成功时的回调
}，function(error){
//删除失败时的回调
});或：
tx.executeSql('delete from table1 where id=？',[1],function(tx,result){
//删除成功时的回调
}，function(error){
//删除失败时的回调
});更新数据库表里面的一条数据：
tx.executeSql('updata table1 set name="小红" where id=1',[],function(tx,result){
//数据更新成功时的回调
}，function(error){
//数据更新失败时的回调
});查询满足查询条件的数据：
tx.executeSql('select * from table',[],function(tx,result){
//查询成功时的回调
}，function(error){
//查询失败时的回调
});注：查询成功的时候可以通过回调函数中的result参数的rows属性使用查询返回的数据。
这个例子只是最简单的一种查询语句，如果有更多复杂查询的需求的话可以参考sql语句。
以上是“HTML5中Web Sql的操作方法”这篇文章的所有内容，感谢各位的阅读！希望分享的内容对大家有帮助，更多相关知识，欢迎关注创新互联行业资讯频道！