?

资源来自于www.mhtml5.com 杨丰盛老师成都场的PPT分享 一个很简明的demo 可以作为入门基础

学习的过程中做了点笔记 整理如下 虽然内容比较简单 但是数量还是比较多的 所以分了3篇

（上）包括Android设备多分辨率的问题，Android中构建HTML5应用程序基础

（中）包括Android与JS之间的互动，Android处理JS的警告对话框等，Android中的调试

（下）包括本地储存在Android中的应用，地理位置的应用，离线应用的构建

—————————————————————————————— 分割线 ————————————————————————————————————————

进入正题

● HTML5本地存储在Android中的应用

HTML5提供了2种客户端存储数据新方法：

localStorage 没有时间限制

sessionStorage 针对一个Session的数据存储

?

	<script type="text/javascript"> 
		localStorage.lastname="Smith"; 
		document.write(localStorage.lastname); 
	</script> 
	<script type="text/javascript"> 
		sessionStorage.lastname="Smith"; 
		document.write(sessionStorage.lastname);
	</script> 

?

WebStorage的API:

?

	//清空storage
	localStorage.clear();
	//设置一个键值
	localStorage.setItem(“yarin”,“yangfegnsheng”);
	//获取一个键值
	localStorage.getItem(“yarin”); 
	//获取指定下标的键的名称（如同Array）
	localStorage.key(0); 
	//return “fresh” //删除一个键值
	localStorage.removeItem(“yarin”);
	注意一定要在设置中开启哦
	setDomStorageEnabled（true）

?

在Android中进行操作

?

	//启用数据库
	webSettings.setDatabaseEnabled(true);  
	String dir = this.getApplicationContext().getDir("database", Context.MODE_PRIVATE).getPath();
	//设置数据库路径
	webSettings.setDatabasePath(dir);
	//使用localStorage则必须打开
	webSettings.setDomStorageEnabled(true);
	//扩充数据库的容量（在WebChromeClinet中实现）
	public void onExceededDatabaseQuota(String url, String databaseIdentifier, long currentQuota, 
			long estimatedSize, long totalUsedQuota, WebStorage.QuotaUpdater quotaUpdater) {
		quotaUpdater.updateQuota(estimatedSize * 2);
	}

?

在JS中按常规进行数据库操作

?

	function initDatabase() {
	try {
	    if (!window.openDatabase) {
	        alert('Databases are not supported by your browser');
	    } else {
	        var shortName = 'YARINDB';
	        var version = '1.0';
	        var displayName = 'yarin db';
	        var maxSize = 100000; // in bytes
	        YARINDB = openDatabase(shortName, version, displayName, maxSize);
			createTables();
			selectAll();
	    }
	} catch(e) {
	    if (e == 2) {
	        // Version mismatch.
	        console.log("Invalid database version.");
	    } else {
	        console.log("Unknown error "+ e +".");
	    }
	    return;
	} 
	}

	function createTables(){
		YARINDB.transaction(
			function (transaction) {
				transaction.executeSql('CREATE TABLE IF NOT EXISTS yarin(id INTEGER NOT NULL PRIMARY KEY, name TEXT NOT NULL,desc TEXT NOT NULL);', [], nullDataHandler, errorHandler);
			}
		);
		insertData();
	}

	function insertData(){
		YARINDB.transaction(
			function (transaction) {
			//Starter data when page is initialized
			var data = ['1','yarin yang','I am yarin'];  
			
			transaction.executeSql("INSERT INTO yarin(id, name, desc) VALUES (?, ?, ?)", [data[0], data[1], data[2]]);
			}
		);	
	}

	function errorHandler(transaction, error){
		if (error.code==1){
			// DB Table already exists
		} else {
			// Error is a human-readable string.
			console.log('Oops.  Error was '+error.message+' (Code '+error.code+')');
		}
		return false;
	}


	function nullDataHandler(){
		console.log("SQL Query Succeeded");
	}

	function selectAll(){ 
		YARINDB.transaction(
			function (transaction) {
				transaction.executeSql("SELECT * FROM yarin;", [], dataSelectHandler, errorHandler);
			}
		);	
	}

	function dataSelectHandler(transaction, results){
		// Handle the results
		for (