HTML5的Web SQL Databases（html5 本地数据库）的确很诱惑人，当你发现可以用与mysql查询一样的查询语句来操作本地数据库时，你会发现这东西挺有趣的。今天，我们一起来了解HTML 5的Web SQL Database API:openDatabase、transaction、executeSql。
Web SQL数据库API实际上不是HTML5规范的组成部分，而是单独的规范。它通过一套API来操纵客户端的数据库。Safari、Chrome、Firefox、Opera等主流浏览器都已经支持Web SQL Database。HTML5的Web SQL Databases的确很诱惑人，当你发现可以用与mysql查询一样的查询语句来操作本地数据库时，你会发现这东西挺有趣的。今天，我们一起来了解HTML 5的Web SQL Database API。
下面将一一将介绍怎样创建打开数据库，创建表，添加数据，更新数据，删除数据，删除表 。
先介绍三个核心方法
1、openDatabase：这个方法使用现有数据库或创建新数据库创建数据库对象。
2、transaction：这个方法允许我们根据情况控制事务提交或回滚。
3、executeSql：这个方法用于执行真实的SQL查询。
第一步：打开连接并创建数据库
代码如下:
var dataBase = openDatabase("student", "1.0", "学生表", 1024 * 1024, function () { });
if (!dataBase) {
alert("数据库创建失败！");
} else {
alert("数据库创建成功！");
}
解释一下openDatabase方法打开一个已经存在的数据库，如果数据库不存在，它还可以创建数据库。几个参数意义分别是：
1，数据库名称。
2，版本号 目前为1.0,不管他，写死就OK。
3，对数据库的描述。
4，设置数据的大小。
5，回调函数(可省略)。
初次调用时创建数据库，以后就是建立连接了。
创建的数据库就存在本地，路径如下：
C:\Users\Administrator\AppData\Local\Google\Chrome\User Data\Default\databases\http_localhost_4987 。
创建的是一个sqllite数据库，可以用SQLiteSpy打开文件，可以看到里面的数据。SQLiteSpy是一个绿色软件，可以网络一下下载地址或SQLiteSpy官方下载：SQLiteSpy。
第二步：创建数据表
代码如下:
this.createTable=function() {
dataBase.transaction( function(tx) {
tx.executeSql(
"create table if not exists stu (id REAL UNIQUE, name TEXT)",
[],
function(tx,result){ alert('创建stu表成功'); },
function(tx, error){ alert('创建stu表失败:' + error.message);
});
});
}
解释一下，
executeSql函数有四个参数，其意义分别是：
1）表示查询的字符串，使用的SQL语言是SQLite 3.6.19。
2）插入到查询中问号所在处的字符串数据。
3）成功时执行的回调函数。返回两个参数：tx和执行的结果。
4）一个失败时执行的回调函数。返回两个参数：tx和失败的错误信息。
第三步：执行增删改查
1）添加数据：
代码如下:
this.insert = function () {
dataBase.transaction(function (tx) {
tx.executeSql(
"insert into stu (id, name) values(?, ?)",
[id, '徐明祥'],
function () { alert('添加数据成功'); },
function (tx, error) { alert('添加数据失败: ' + error.message);
} );
});
2）查询数据
代码如下:
this.query = function () {
dataBase.transaction(function (tx) {
tx.executeSql(
"select * from stu", [],
function (tx, result) { //执行成功的回调函数
//在这里对result 做你想要做的事情吧...........
},
function (tx, error) {
alert('查询失败: ' + error.message);
} );
});
}
解释一下
上面代码中执行成功的回调函数有一参数result。
result：查询出来的数据集。其数据类型为 SQLResultSet ，就如同C#中的DataTable。
SQLResultSet 的定义为：
代码如下:
interface SQLResultSet {
readonly attribute long insertId;
readonly attribute long rowsAffected;
readonly attribute SQLResultSetRowList rows;
};
其中最重要的属性—SQLResultSetRowList 类型的 rows 是数据集的“行” 。
rows 有两个属性：length、item 。
故，获取查询结果的某一行某一列的值 ：result.rows[i].item[fieldname] 。
3）更新数据
代码如下:
this.update = function (id, name) {
dataBase.transaction(function (tx) {
tx.executeSql(
"update stu set name = ? where id= ?",
[name, id],
function (tx, result) {
},
function (tx, error) {
alert('更新失败: ' + error.message);
});
});
}
4）删除数据
代码如下:
this.del = function (id) {
dataBase.transaction(function (tx) {
tx.executeSql(
"delete from stu where id= ?",
[id],
function (tx, result) {
},
function (tx, error) {
alert('删除失败: ' + error.message);
});
});
}
5）删除数据表
代码如下:
this.dropTable = function () {
dataBase.transaction(function (tx) {
tx.executeSql('drop table stu');
});
}
Ⅱ html5是什么干什么的
就主要而言，HTML是一种标记语言，是网页的规范编程语言
1.主要适用于面向Web编程
【例如】Wechat公众号的部分HTML5小游戏，Web端的网页包括网络/谷歌都是使用HTML的
【图片例子】Google搜索界面和Bai图片界面
【特点】一个网页可以包含图像，图形，视频，音频，文字，动画等不同的多媒体信息，网页主要适用HTTP/FTP协议，遍布各个范畴，任何一个编程语言都必须被转化为纯HTML格式才可以被读取，因此其在互联网上是很高的地位。
Ⅲ H5是什么编程语言吗
H5是指HTML5，它万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言（HTML）的第五次重大修改。
HTML5提供了一些新的元素和属性，例如<nav>（网站导航块）和<footer>。这种标签将有利于搜索引擎的索引整理，同时更好的帮助小屏幕装置和视障人士使用，除此之外，还为其他浏览要素提供了新的功能，如<audio>和<video>标记。
它有以下改进：
1、取消了一些过时的HTML4标记
其中包括纯粹显示效果的标记，如<font>和<center>，它们已经被CSS取代。
2、将内容和展示分离
b和i标签依然保留，但它们的意义已经和之前有所不同，这些标签的意义只是为了将一段文字标识出来，而不是为了为它们设置粗体或斜体式样。u，font，center，strike 这些标签则被完全去掉了。
3、一些全新的表单输入对象
包括日期，URL，Email 地址，其它的对象则增加了对非拉丁字符的支持。HTML5 还引入了微数据，这一使用机器可以识别的标签标注内容的方法，使语义Web 的处理更为简单。
4、全新的，更合理的Tag
多媒体对象将不再全部绑定在object或 embed Tag 中，而是视频有视频的Tag，音频有音频的 Tag。
5、本地数据库
这个功能将内嵌一个本地的SQL数据库，以加速交互式搜索，缓存以及索引功能。同时，那些离线Web 程序也将因此获益匪浅。不需要插件的丰富动画。
6、Canvas 对象
将给浏览器带来直接在上面绘制矢量图的能力，这意味着用户可以脱离Flash Silverlight，直接在浏览器中显示图形或动画。
7、浏览器中的真正程序
将提供API实现浏览器内的编辑，拖放，以及各种图形用户界面的能力。内容修饰Tag 将被剔除，而使用CSS。
8、Html5取代Flash在移动设备的地位。
9、其突出的特点就是强化了web页的表现性,追加了本地数据库,
(3)h5sql扩展阅读：
HTML5的未来趋势：
1、移动优先
从如今层出不穷的移动应用就知道，在这个智能手机和平板电脑大爆炸的时代，移动优先已成趋势，不管是开发什么，都是以移动为主。
2、游戏开发者领衔“主演”
许多游戏开发商都被Facebook或者Zynga推动着发展，而未来的Facebook应用生态系统是基于HTML5的，尽管在HTML5平台开发出游戏非常困难，但游戏开发商却都愿意那么做。
通过PhoneGap及appmobi的XDK将Web应用游戏打包整合到原生应用中也是一种方式，Facebook差不多就这么干的——基于Web应用及浏览器，但却将之打包整合进原生应用。
Ⅳ 求大神来一段用H5编写的连接sql server数据库的代码，必有重谢
H5是前端语言，前端无法连接数据库，目前只有后端语言可以连接数据库，前端通过ajax或者其他形式的接口与后端语言通讯，常见的后端语言有asp.net,php,java,因为前端语言可见，可以调试，如果能够直接连接数据库会造成很大的安全隐患
Ⅳ HTML5的5种存储方式详解
引言
本篇文章主要介绍了前端HTML5几种存储方式的总结 ，主要包括本地存储localstorage，本地存储sessionstorage，离线缓存（application cache），Web SQL，IndexedDB。有兴趣的可以了解一下。
正文开始~
h5之前，存储主要是用cookies。cookies缺点有在请求头上带着数据，大小是4k之内。主Domain污染。
主要应用：购物车、客户登录
对于IE浏览器有UserData，大小是64k,只有IE浏览器支持。
目标
存储方式：
以键值对(Key-Value)的方式存储，永久存储，永不失效，除非手动删除。
大小：
每个域名5M
支持情况：
注意：IE9 localStorage不支持本地文件，需要将项目署到服务器，才可以支持！
常用的API：
getItem //取记录
setIten//设置记录
removeItem//移除记录
key//取key所对应的值
clear//清除记录
存储的内容：
数组，图片，json，样式，脚本。。。（只要是能序列化成字符串的内容都可以存储）
HTML5 的本地存储 API 中的 localStorage 与 sessionStorage 在使用方法上是相同的，区别在于 sessionStorage 在关闭页面后即被清空，而 localStorage 则会一直保存。
本地缓存应用所需的文件
使用方法：
①配置manifest文件
页面上：
Manifest 文件：
manifest 文件是简单的文本文件，它告知浏览器被缓存的内容（以及不缓存的内容）。
manifest 文件可分为三个部分：
①CACHE MANIFEST - 在此标题下列出的文件将在首次下载后进行缓存
②NETWORK - 在此标题下列出的文件需要与服务器的连接，且不会被缓存
③FALLBACK - 在此标题下列出的文件规定当页面无法访问时的回退页面（比如 404 页面）
完整demo：
服务器上： manifest文件需要配置正确的MIME-type，即 "text/cache-manifest"。
如Tomcat:
常用API：
核心是applicationCache对象，有个status属性，表示应用缓存的当前状态：
0（UNCACHED） : 无缓存， 即没有与页面相关的应用缓存
1（IDLE） : 闲置，即应用缓存未得到更新
2 （CHECKING） : 检查中，即正在下载描述文件并检查更新
3 （DOWNLOADING） : 下载中，即应用缓存正在下载描述文件中指定的资源
4 （UPDATEREADY） : 更新完成，所有资源都已下载完毕
5 （IDLE） : 废弃，即应用缓存的描述文件已经不存在了，因此页面无法再访问应用缓存
相关的事件：
表示应用缓存状态的改变：
checking : 在浏览器为应用缓存查找更新时触发
error : 在检查更新或下载资源期间发送错误时触发
noupdate : 在检查描述文件发现文件无变化时触发
downloading : 在开始下载应用缓存资源时触发
progress：在文件下载应用缓存的过程中持续不断地下载地触发
updateready : 在页面新的应用缓存下载完毕触发
cached : 在应用缓存完整可用时触发
Application Cache的三个优势：
① 离线浏览
② 提升页面载入速度
③ 降低服务器压力
注意事项：
1. 浏览器对缓存数据的容量限制可能不太一样（某些浏览器设置的限制是每个站点 5MB）
2. 如果manifest文件，或者内部列举的某一个文件不能正常下载，整个更新过程将视为失败，浏览器继续全部使用老的缓存
3. 引用manifest的html必须与manifest文件同源，在同一个域下
4. 浏览器会自动缓存引用manifest文件的HTML文件，这就导致如果改了HTML内容，也需要更新版本才能做到更新。
6. FALLBACK中的资源必须和manifest文件同源
7. 更新完版本后，必须刷新一次才会启动新版本（会出现重刷一次页面的情况），需要添加监听版本事件。
8. 站点中的其他页面即使没有设置manifest属性，请求的资源如果在缓存中也从缓存中访问
9. 当manifest文件发生改变时，资源请求本身也会触发更新
离线缓存与传统浏览器缓存区别：
1. 离线缓存是针对整个应用，浏览器缓存是单个文件
2. 离线缓存断网了还是可以打开页面，浏览器缓存不行
3. 离线缓存可以主动通知浏览器更新资源
关系数据库，通过SQL语句访问
Web SQL 数据库 API 并不是 HTML5 规范的一部分，但是它是一个独立的规范，引入了一组使用 SQL 操作客户端数据库的 APIs。
支持情况：
Web SQL 数据库可以在最新版的 Safari, Chrome 和 Opera 浏览器中工作。
核心方法：
①openDatabase： 这个方法使用现有的数据库或者新建的数据库创建一个数据库对象。
②transaction： 这个方法让我们能够控制一个事务，以及基于这种情况执行提交或者回滚。
③executeSql： 这个方法用于执行实际的 SQL 查询。
打开数据库：
执行查询操作：
插入数据：
读取数据：
由这些操作可以看出，基本上都是用SQL语句进行数据库的相关操作，如果你会MySQL的话，这个应该比较容易用。
索引数据库 (IndexedDB) API（作为 HTML5 的一部分）对创建具有丰富本地存储数据的数据密集型的离线 HTML5 Web 应用程序很有用。同时它还有助于本地缓存数据，使传统在线 Web 应用程序（比如移动 Web 应用程序）能够更快地运行和响应。
异步API：
在IndexedDB大部分操作并不是我们常用的调用方法，返回结果的模式，而是请求——响应的模式，比如打开数据库的操作
这样，我们打开数据库的时候，实质上返回了一个DB对象，而这个对象就在result中。由上图可以看出，除了result之外。还有几个重要的属性就是onerror、onsuccess、onupgradeneeded（我们请求打开的数据库的版本号和已经存在的数据库版本号不一致的时候调用）。这就类似于我们的ajax请求那样。我们发起了这个请求之后并不能确定它什么时候才请求成功，所以需要在回调中处理一些逻辑。
关闭与删除：
数据存储：
indexedDB中没有表的概念，而是objectStore，一个数据库中可以包含多个objectStore，objectStore是一个灵活的数据结构，可以存放多种类型数据。也就是说一个objectStore相当于一张表，里面存储的每条数据和一个键相关联。
我们可以使用每条记录中的某个指定字段作为键值（keyPath），也可以使用自动生成的递增数字作为键值（keyGenerator），也可以不指定。选择键的类型不同，objectStore可以存储的数据结构也有差异。
学习从来不是一个人的事情，要有个相互监督的伙伴，想要学习或交流前端问题的小伙伴可以私信“学习”小明获取web前端入门资料，一起学习，一起成长！
Ⅵ html5 web sql遇到的问题求帮助
第一，你对技术不够了解，无法体现精髓。
第二，凡是新的都不一定能普遍应用，而不能普遍应用的，价值也就不高咐老举。
可以联想一下真正的大厨比赛，凡是用料最奢华、搞得最缤纷的菜，一定会败给外表朴素内容却不平淡但也绝不是简单的强烈刺激的菜，因为真正比含衫拼的是制作者的各方面基本功和对衡碧色香味意境界的理解。
因此，哪怕两个人在境界和功夫上真的具有相同的水平，那么选择朴素平常的也比选择奢华新奇的要得分高，因为他更自信。
Ⅶ HTML5的 web sql 中数据，如何批量导入/导出
不能批量导入，可以生成SQL语句的JS文件，判断数据后执行JS进行导入即可。
Ⅷ html5怎么连接数据库
在HTML5之前的时代，如果需要在客户端本地保存数据，只能存储在Cookie中，但是 Cookie使用过多会影响请求速度 ，所以并不适合存储大量数据。
而在HTML5面世后，自带了本地存储和本地数据库功能，更为便捷的管理客户端数据。
HTML5提供了一个 基于浏览器端的数据库 （WebSQL 、IndexedDB），我们可以通过JS API来在浏览器端创建一个本地数据库，而且它还支持标准的SQL来执行CRUD操作。
如何查看本地的数据库呢？通过各个 浏览器的调试工具 可以查看。
在HTML5中操作本地数据库都是通过JS API来实现的，很简单，步聚如下：
1、通过 openDatabase 创建数据库对象
2、通过 db.transaction 设置回调函数
3、通过 executeSql 方法执行查询
HTML5默认情况下是无法连接远程数据库的，一般都是通过API去操作数据库。比如当下流行的前后端完全分离，借助的就是RESTful来实现业务数据的CRUD操作。
怎么会问这个问题，HTML是不可能链接数据库的，他是标签类语言，是用于构建静态页面的，要想链接数据库必须得支持网络通信和IO的，显然HTML并没有支持，HTML只是用来设计页面的。
我还以为我落伍了，h5连数据库
Ⅸ H5用户登录测试用例
输入已注册的用户名和正确的密码，验证是否登录成功；
输入已注册的用户名和不正确的密码，验证是否登录失败，并且提示信息正确；
输入未注册的用户名和任意密码，验证是否登录失败，并且提示信息正确；
输入未激活的、已锁定的、被注销的用户名和正确密码，验证是否登录成功；
用户名和密码两者都为空，验证是否登录失败，并且提示信息正确；
用户名和密码两者之一为空，验证是否登录失败，并且提示信息正确；
第一次登录失败，再次输入正确的用户名和密码，验证是否登录成功；
如果登录功能启用了验证码功能，用户名、密码、验证码都输入正确，验证是否登录成功；
如果登录功能启用了验证码功能，用户名、密码正确，验证码输入错误，验证是否登录失败，皮型并且提示信息正确；
点击验证码图片是否可以更换验证码，更换后的验证码是否可用；
刷新页面是否会刷新验证码，刷新后的验证码是否可用；
如果验证码具有时效性，需要分别验证时效内和时效外验证码的有效性；
无网络模式下登录，是否给出“网络未连接”或“网络异常”的提示；
第一次登录请求超时后（服务器出问题，随后恢复正常），再次请求登录能否登录成功。
页面默认焦点是否定位在用户名的输入框中；
快捷键 Tab 和 Enter 等，是否可以正常使用；
用户名和密码是否大小写、空格敏感；
使用中文、英文键盘输入字母传给后端的字符长度是否一致；
前端页面是否根据设计要求限制用户名和密码长度，且前后台都需要限制；
页面上的密码框是否加密显示，是否需要设置明暗码切换按钮；
输入栏是否设置快速删除按钮；
忘记用户名和忘记密码的功能是否可用；
修改密码后，是否重定向到登录页面；
修改密码后，原密码是否作废不可用；
在其他终端修改密码后，PC端是否自动下线，若下线后，使用原密码能否继续登录；
使用默认密码第一次登录成功时，是否提示修改密码；
第一次登录成功，是否会同步其他终端用户信息；
用户登录成功但是会话超时后，继续操作是否会重定向到用户登录界面；
不同级别的用户，比如管理员用户和普通用户，登录系统后的权限是否正确；
输入错误密码的限制次数：
分别测试最大值-1、最大值、最大值+1 时的输错密码情况；
超过最大次数限制后，是否采取强制手段限制登录或对账号暂时冻结处理；
超过最大次数限制后，分别输入正确的密码和错误的密码再次登录。
用户名、密码、验证码输入框是否不支持复制和粘贴；
密码输入框内输入的密码是否都可以在页面源码模式下被查看；
用户密码后台存储是否加密；
用户密码在网络传输过程中是否加密；
密码是否具有“有效期”，密码有效期到期后，是否提示需要修改密码；
是否可记住密码，记住的密码保存是否加密；
记住密码是否有“有效期”，若有“有效期”，过期之后是否会清岩芦空密码；
登录成功后的session时效设置；
登录错误后的提示是否有安全隐患；
退出登录后再次登录，使用记住的密码，是否登录成功；
不登录的情况下，在浏览器中直接输入登录后的 URL 地址，验证是否会重新定向到用户登录界面；
用户登录过程中log中是否有个人信息明文打印
用户名和密码的输入框中分别输入典型的“SQL 注入攻击”字符串，验证系统的返回页面；
用户名和密码的输入框中分别输入典型的“XSS 跨站脚本攻击”字符串，验证系统行为是否被篡改；
连续多次登录失败情况下，系统是否会阻止后续的尝试以应对暴力破解；
登录后输入登录URL，是否还能再次登录？如果能，原登录用户是否变得无效；
同用户同终端的多种浏览器上登录，验证登录功能的互斥性是否符合设计预期；
同用户不同终端，先后登录，验证登录是否具有互斥性；
同用户同浏览器已经登录，再次打开一个标签页时，是否需要重新登录；
不同用户在同终端同浏览器登录，验证登录信息token的正确性；
不同用户在同终端同浏览器登录，被踢后，页面是否会跳转到登录页；
是否支持第三方登录，如微信、QQ、微博；
是否允许第三方工具平台存储密码；
是否可以使用登录的API发送登录请求，并绕开验证码校验燃枣猜；
是否可以用抓包工具抓到的请求包直接登录；
截取到的token等信息，是否可以在其他终端上直接使用，绕开登录。token过期时间校验；
性能压力测试用例:
单用户登录的响应时间是否小于 3 秒；
单用户登录时，后台请求数量是否过多；
高并发场景下用户登录的响应时间是否小于 5 秒；
高并发场景下服务端的监控指标是否符合预期；
高集合点并发场景下，是否存在资源死锁和不合理的资源等待；
长时间大量用户连续登录和登出，服务器端是否存在内存泄漏。
兼容性测试用例：
不同浏览器下，验证登录页面的显示以及功能正确性；
相同浏览器的不同版本下，验证登录页面的显示以及功能正确性；
不同移动设备终端的不同浏览器下，验证登录页面的显示以及功能正确性；
不同分辨率的界面下，验证登录页面的显示以及功能正确性；
网络延迟或者弱网或者切换网络或者断网时正常登录是否正常
Ⅹ hbuilder 中H5的websql 制作APP android或ios都可以使用么
遇到问题应该是这样解决的岩孝： 1.尽力去检查自己辩枣搜的代码，看有无低级错误； 2.Google之（这个一定要会，属于基本技能。。。） 3.实在找不到错误，询问周边的朋友同事等（有时你自己看半天看不出的错误，他们可能会一眼就看出来了） 4.去相关网站提问，如stackoverflow、segmentfault等 只有这样你才能更携历快的提高。。。