js 操作本地sqlite
<!DOCTYPE html>
<html lang="zh-CN"> <head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="renderer" content="webkit">
<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=0.7, maximum-scale=0.7">
<title>SQLITE 浏览器</title>
<style>
table {
*border-collapse: collapse;
/* IE7 and lower */
border-spacing: 0;
} .table {
border: solid #ccc 1px;
box-shadow: 0 1px 1px #ccc;
font-size: 12px;
font-family: Courier New, Courier, monospace;
} .table .highlight,
.table tr:hover {
background: #ddd;
} .table td,
.table th {
border-left: 1px solid #ccc;
border-top: 1px solid #ccc;
padding: 2px 5px;
text-align: left;
} .table th {
background-color: #dce9f9;
background-image: linear-gradient(top, #ebf3fc, #dce9f9);
box-shadow: 0 1px 0 rgba(255, 255, 255, .8) inset;
border-top: none;
text-shadow: 0 1px 0 rgba(255, 255, 255, .5);
} .table td:first-child,
.table th:first-child {
border-left: none;
}
</style>
<script src="/js/jquery.min.js"></script> <script>
var db = null;
function openDb(dbName) {
dbName = dbName || 'db';
db = openDatabase(dbName, '1.0', 'ENH_sqlite DB', 200 * 1024 * 1024);
console.log(db);
} var isRun = false;
function runSql(sql) {
if (db == null) {
openDb();
if (db == null) return;
}
if (!sql) return;
if (isRun) return;
isRun = true; console.time('run');
db.transaction(function (tx) {
tx.executeSql(sql, [], function (tx, res) {
isRun = false;
console.timeEnd('run');
console.log(res);
if (res.rowsAffected > 0) {
$('#divInfo').css('color', '').html('影响' + res.rowsAffected + '行');
showTable([]);
}
else {
$('#divInfo').css('color', '').html('获取' + res.rows.length + '条数据');
showTable(res.rows);
}
}, function (tx, err) {
isRun = false;
console.timeEnd('run');
console.error(err);
$('#divInfo').css('color', 'red').html(err.message);
});
});
} function showTable(rows) {
$('#tbList thead').html('');
$('#tbList tbody').html('');
if (rows.length == 0) return; var tr = $('<tr></tr>');
for (var k in rows.item(0)) {
tr.append('<th>' + k + '</th>');
}
$('#tbList thead').append(tr); var html = '';
for (var i=0; i<rows.length; i++) {
var r = rows.item(i);
html += '<tr>';
for (var kk in r) {
html += '<td>' + htmlEncode(r[kk]) + '</td>';
}
html += '</tr>';
}
$('#tbList tbody').append(html);
} function htmlEncode(str) {
var ele = document.createElement('span');
ele.appendChild(document.createTextNode(str));
return ele.innerHTML;
}
function htmlDecode(str) {
var ele = document.createElement('span');
ele.innerHTML = str;
return ele.textContent;
} var id = 0;
function getGps() {
id++;
var gps = {
id: id,
car_no: 'RL0101',
lon: 108 + Math.random(),
lat: 34 + Math.random(),
deg: Math.round(Math.random() * 360),
last_id: id - 1,
data: '' + (1 + Math.random()) + ',100',
}; return gps;
} function addGpsList(list) {
if (!list) return; var key_list = [];
for (var key in list[0]) {
key_list.push(key);
} var gps_list = [];
for (var k in list) {
var val_list = [];
for (var kk in list[k]) {
val_list.push("'" + list[k][kk] + "'");
}
gps_list.push('(' + val_list.join(',') + ')')
} var sql = "INSERT INTO gps_list (" + key_list.join(',') + ") VALUES " + gps_list.join(',');
runSql(sql);
}
</script>
</head> <body style="line-height: 1.5;">
<h3 style="margin:5px 0;">JS sqlite 数据库操作</h3>
<ul style="font-size:12px; color:gray; padding-left:15px;">
<li>创建:CREATE TABLE IF NOT EXISTS LOGS (id unique, log)</li>
<li>插入:INSERT INTO LOGS (id, log) VALUES (1, "foobar")</li>
<li>查询:SELECT * FROM LOGS</li>
<li>删除:DELETE FROM LOGS WHERE id = 1</li>
<li>所有表:SELECT * FROM sqlite_master WHERE type="table";</li>
<li>删除表:DROP TABLE LOGS</li>
<li>类型:INTEGER,TEXT,REAL,NUMERIC</li>
</ul>
<input id="txtDbName" type="text" value="db" /> <input type="button" value="连接数据库" onclick="openDb($('#txtDbName').val());" /><br>
<input id="txtSql" type="text" value="SELECT * FROM LOGS" style="width:600px;" />
<input type="button" value="执行SQL" onclick="runSql($('#txtSql').val());" /><br>
<input type="button" value="创建GPS数据库" onclick="runSql('CREATE TABLE IF NOT EXISTS gps_list(id, car_no, lon NUMBER, lat NUMBER, deg NUMBER, last_id, data)');"
/>
<input type="button" value="添加GPS数据" onclick="addGpsList([getGps(), getGps()]);" />
<div id="divInfo"></div>
<table id="tbList" class="table">
<thead>
</thead>
<tbody>
</tbody>
</table>
</body> </html> <!--
常见GPS数据库
CREATE TABLE IF NOT EXISTS gps_list(id, car_no, lon NUMBER, lat NUMBER, deg NUMBER, last_id, data)
-->
js 操作本地sqlite的更多相关文章
- js操作本地文件
只有IE支持js对本地文件操作 其他浏览器都不支持
- Electron中使用sql.js操作SQLite数据库
推荐sql.js——一款纯js的sqlite工具. 一.关于sql.js sql.js(https://github.com/kripken/sql.js)通过使用Emscripten编译SQLite ...
- JS操作cookie以及本地存储(sessionStorage 和 localStorage )
JS操作cookie cookie的操作用两种方式 1.substring //创建cookie function setCookie(name,value,expires,path,domain,s ...
- F12修改html进行本地js操作页面元素
F12修改html进行本地js操作页面元素
- js -- 操作sqlite数据库
最近看到一个使用js来操作sqlite数据库的,测试了一下,具体使用的是 js操作类: https://github.com/kripken/sql.js/(sqlite js 驱动) 异步请求:ht ...
- cordova调用本地SQLite数据库的方法
第一篇技术博客,写下来和大家分享今天所学,其次自己也巩固一下. 整个下午的时间用来钻研如何用cordova调用移动端本地SQLite数据库.首先我并不是用eclipse来编程的,而是用cordova建 ...
- [荐]使用Js操作注册表
使用Js操作注册表 要操作注册表需要通过ActiveX控件调用WScript.shell对象,通过该对象的一些方法来操作. WshShell对象:可以在本地运行程序.操纵注册表内容.创建快捷方式或访问 ...
- JS操作select标签
主要利用这个来实现省市区三级联动的 我利用的是ajax,每一次onchange事件都改变相对应的select中的option,数据全是ajax请求服务器查询数据库而来的,效果还可以,在本地测试的时候速 ...
- js 操作 cookie
js 操作 cookie 的方法如下: //设置cookie function setCookie(cname, cvalue, exdays) { var d = new Date(); d.set ...
随机推荐
- git在项目中的实际运用
项目中只运用git版本管理的情况下: 1.创建分支命令: git branch (branchname) 切换分支命令: git checkout (branchname) 当你切换分支的时候,Git ...
- spring MVC 项目 WEB-INF下的jsp不能加载css文件
一.项目目录 二.解决方法(已解决) 1. jsp文件加入 <link href="<c:url value="/css/main.css" />&qu ...
- 出错:Failed to convert property value of type 'org.apache.ibatis.session.defaults.DefaultSqlSessionFactory' to required type 'java.lang.String' for property 'sqlSessionFactoryBeanName';
出错的详细信息: 3 ERROR [http-nio-80-exec-3] org.springframework.web.servlet.DispatcherServlet - Context in ...
- insert into
1. INSERT INTO t1(field1,field2) VALUE(v001,v002); // 明确只插入一条Value 2. INSERT INTO t1(fiel ...
- python3.0j基语法-01
python基础语法,字符编码,python解释器在加载 .py 文件中的代码时,会对内容进行编码(默认ascill) print("Hello word") 一个简单hello ...
- n2n windows 编译安装文件
n2n安装 n2n原理编译版下载,可直接使用:windows下vpn客户端 n2n_v2_linux_x64 n2n_v2_Win32TAP网卡驱动 #linux环境编译yum install -y ...
- CocosCreator检测动作执行完毕的方法~之一吧,应该= =
解决方案是利用动作序列,在动作后面跟一个回调函数,然后再利用之前设置好的动作执行完毕标志,即可完成动作结束的判断!Bingo!
- C# BackJson Beautiful format
using System; using System.Collections.Generic; using System.Linq; using System.Web; public class ...
- .NET英文技术文章导读(2017-03-23)
关键字:VS2017.扩展.Service Fabric.Unit Test.ELMAH Web开发人员必装的5个VS2017扩展 作者:Jeffrey T. Fritz 链接:https://blo ...
- SharePoint修改左上角文字的命令行
$webapp = Get-SPWebApplication “http://test-spweb1” --需要修改的站点$webapp.SuiteNavBrandingText = “XXXXXX” ...