HTML5怎么连接数据库

HTML5怎么连接数据库,第1张

HTML5连接数据分为以下几步:

预备知识:Web SQL Database,Html5环境下可以用Js执行CRUD的Web数据库组件。

核心方法如下:

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

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

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

第一步:打开连接并创建数据库

var dataBase = openDatabase("student", "1.0", "student", 1024 * 1024, function () { })

if (!dataBase) {

alert("数据库创建失败!")

} else {

alert("数据库创建成功!")

}

第二步:创建数据表

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)

})

})

}

第三步:执行增删改查

添加数据:

this.insert = function () {

dataBase.transaction(function (tx) {

tx.executeSql(

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

[id, '徐明祥'],

function () { alert('添加数据成功')},

function (tx, error) { alert('添加数据失败: ' + error.message)

} )

})

在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连数据库

首先来看看怎样创建数据库:

1、创建数据库

var db = window.openDatabase("mydata", "1.0","数据库描述",20000)

//window.openDatabase("数据库名字", "版本","数据库描述",数据库大小)

if(db)

alert("新建数据库成功!")

2、怎样连接数据库

db.transaction(function(tx) {

tx.executeSql("CREATE TABLE test (id int UNIQUE, mytitle TEXT, timestamp REAL)")

})

上面是新建数据表!本地数据库是通过db.transaction()函数来实现的,再看下面的代码吧!

插入记录:

db.transaction(function(tx) {

tx.executeSql("INSERT INTO test (mytitle, timestamp) values(?, ?)", ["WEB Database", new Date().getTime()], null, null)

})

更新记录:

db.transaction(function(tx) {

tx.executeSql("update test set mytitle=? where mytitle = 'fsafdsaf'",['xp'],null,null)

})

查询记录:

db.transaction(function(tx) {

tx.executeSql("SELECT * FROM test", [],

function(tx, result) {

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

document.write('<b>' + result.rows.item(i)['mytitle'] + '</b><br />')

}

}, function(){

alert("error")

})

})

删除表:

db.transaction(function(tx) {

tx.executeSql("DROP TABLE test")

})


欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/zaji/7451790.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-05
下一篇 2023-04-05

发表评论

登录后才能评论

评论列表(0条)

保存