HTML5新的Input类型
输入类型:color,data,datetime,datetime-local,email,month,number,range,search,tel,time,url,week
HTML Web存储 localStorage
没有时间限制的数据存储
以键/值对的形式表示
setItem(),getItem()
localStorage.name="Smith";
sessionStorage
当用户关闭浏览器窗口时,数据会被删除
以键/值对的形式表示
setItem(),getItem()
sessionStorage.setItem('name','smith');
Web SQL数据库(略)
核心方法:
openDatabase 使用现有的数据库或新建的数据库创建一个数据库对象
transaction 这个方法使我们能够控制一个事务,以及基于这种情况执行提交或者回滚
executeSql 这个方法用于执行实际的SQL查询
一个完整实例
状态信息
Copy code
Application cache (omitted)
To enable application cache, please include the manifest attribute in the tag of the document:
< ;html manifest="demo.appcache">
...
Copy code
Manifest file
CACHE MANIFEST - Files listed under this heading will be cached after the first download
NETWORK - here The files listed under this heading require a connection to the server and will not be cached
FALLBACK - The files listed under this heading specify the fallback page when the page is inaccessible (such as a 404 page)
Complete Manifest file example
CACHE MANIFEST
# 2012-02-21 v1.0.0
/theme.css
/logo.gif
/main.js
NETWORK:
login.php
FALLBACK:
/html/ /offline.html
Copy code
Web Workers
Web worker is javascript running in the background, independent of other scripts, and will not affect the performance of the page
function startWorker(){
if(typeof(Worker) != "undefined"){
if(typeof(w) == " undefined"){
w=new Worker('demo_worker.js');
}
w.onmessage=function(event){
document.getElementById('result').innerHTML=event.data;
};
}
}
function stopWorker(){
w.terminate();
w = undefined;
}
Copy code
/*demo_worker.js*/
var i=0;
function timedCount(){
i=i+ 1;
postMessage(i);
setTimeout('timedCount()',500);
}
timedCount();
Copy code
Server-Sent Event (SSE)
Server-Sent event refers to the automatic acquisition of web pages from the server of updates.
WebSocket
WebSocket is a protocol for full-duplex communication on a single TCP connection that HTML5 started to provide.
In the WebSocket API, the browser and the server only need to perform a handshake action, and then a fast channel is formed between the browser and the server. Data can be transmitted directly between the two.
The browser sends a request to the server to establish a WebSocket connection through JavaScript. After the connection is established, the client and server can directly exchange data through the TCP connection.
After you obtain the Web Socket connection, you can send data to the server through the send() method, and receive data returned by the server through the onmessage event.
var Socket = new WebSocket(url, [protocal])
WebSocket properties
Socket.readyState
0 - Indicates that the connection has not yet been established
1 - Indicates that the connection has been established and communication is possible
2 - Indicates that the connection is being closed
3 - Indicates The connection has been closed or the connection cannot be opened
WebSocket event
Socket.onopen - triggered when the connection is established
Socket.onmessage - triggered when the client receives data from the server
Socket.onerror - triggered when a communication error occurs
Socket.onclose - triggered when the connection is closed Trigger
WebSocket method
Socket.send()
Socket.close()