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查询
一个完整实例
状态信息
코드 복사
애플리케이션 캐시(생략)
애플리케이션 캐시를 활성화하려면 문서 태그에 매니페스트 속성을 포함하세요. >
...
코드 복사
매니페스트 파일
캐시 MANIFEST - 이 헤더 아래에 나열된 파일은 첫 번째 다운로드 후 캐시됩니다.
NETWORK - 이 헤더 아래에 나열된 파일은 서버에 연결해야 하며 캐시되지 않습니다.
FALLBACK - 이 헤더 아래에 나열된 파일은 캐시되지 않습니다. 아래 나열된 페이지에 액세스할 수 없는 경우(예: 404 페이지)
전체 매니페스트 파일 예시
CACHE MANIFEST
# 2012-02-21 v1.0.0
/theme.
/logo.gif
/main.js
NETWORK:
login.php
FALLBACK:
/html/ /offline.html
코드 복사
Web Workers
웹 워커는 다른 스크립트와 독립적으로 백그라운드에서 실행되는 자바스크립트이며 페이지 성능에 영향을 주지 않습니다.
function startWorker(){
if(typeof(Worker) != "undefine"){
if(typeof(w) == "정의되지 않음"){
w=new Worker('demo_worker.js')
}
w.onmessage=function(event){
document.getElementById('result').innerHTML=event.data;
}
}
function stopWorker(){
w.terminate(); 정의되지 않음;
}
코드 복사
/*demo_worker.js*/
var i=0;
function timedCount(){
i=i+1; (i );
setTimeout('timedCount()',500);
}
timedCount()
코드 복사
서버 전송 이벤트(SSE) 이벤트란 서버로부터 자동으로 업데이트를 받는 웹페이지를 말합니다.
WebSocket
WebSocket은 HTML5가 제공하기 시작한 단일 TCP 연결에서 전이중 통신을 위한 프로토콜입니다.
WebSocket API에서는 브라우저와 서버가 핸드셰이크 작업만 수행하면 되며, 그러면 브라우저와 서버 사이에 빠른 채널이 형성됩니다. 데이터는 둘 사이에서 직접 전송될 수 있습니다.
브라우저는 JavaScript를 통해 WebSocket 연결을 요청을 서버에 보냅니다. 연결이 설정된 후 클라이언트와 서버는 TCP 연결을 통해 직접 데이터를 교환할 수 있습니다.
웹 소켓에 연결한 후 send() 메서드를 통해 서버에 데이터를 보내고, onmessage 이벤트를 통해 서버에서 반환된 데이터를 받을 수 있습니다.
var Socket = new WebSocket(url, [protocal])
WebSocket 속성
Socket.readyState
0 - 연결이 아직 설정되지 않았음을 나타냅니다.
1 - 연결이 설정되었음을 나타냅니다.
2 - 연결이 닫히는 중임을 나타냅니다.
3 - 연결이 닫혔거나 열 수 없음을 나타냅니다.
WebSocket 이벤트
Socket.onopen - 다음 경우에 트리거됩니다. 연결이 설정되었습니다.
Socket.onmessage - 클라이언트가 서버 데이터를 수신합니다.
Socket.onerror가 발생할 때 트리거됩니다.
Socket.onclose - 연결이 닫힐 때 트리거됩니다.
WebSocket 메서드
Socket.send()
Socket.close()