HTML&javaSkcript&CSS&jQuery&ajax(11)
1、localStorage 沒有 時間的限制數據存儲, sessionStorage 針對一個session的存儲,首先檢查瀏覽器是否支持對這兩個的存儲,
ifI(type(Storage)!=="undefined"){
// 支持}else{
不支持}
localStorage對數據存儲沒有時間的限制,eg、
<div id="result"></div>
<script> ifI(typeof(Storage)!=="undefined"){
lLocalStorage.sitename="菜鳥";
document.getElementById("result").innerHTML=“網站名”+"localStorage.setname;}
else{
document.getElementById("result").innerHTML="瀏覽器不支持"}</script>
2、計算 <div id="reult"></div>
<script> function clickCount(){
if(typeof(Storage)1=="undefined”){
if(localStorage.clickcount){
localStorage.clickcount=Number(localStorage.clickcount)+1;
}else{
localStorage.clickcount=1;}
document.getElementById("result").innerHTML="localStorage.localcount;
}else{
doucment.getElement.ById(“result”).innerHtml="比支持"}
}</script>
3、web SQL操作
openDatabase 使用數據庫 transaction 控制數據庫 execute Sql 數據庫查詢
打開數據庫 var db=openDatabase("mydb", ‘1.0‘, ‘test DB‘,2*1024*1024)分別是數據庫名稱, 版本號 描述文本 數據庫大小
db.transaction(function(tx){ tx.executeSql(‘CREATE Table if not exists LoGS (id unique,log)‘);});
刪除數據記錄 db.transaction(function(tx){
tx.excuteSql(‘delete from logs where id=1‘)})
更新數據 db.transaction(function(tx){
tx.excuteSql(‘Update logs set log=\‘www.w3cschool\‘ where id=2‘);})
4、啟用應用程序緩存 <!DOCTYPE HTML>
<html manifest="demo.appcache"> </html>
5、接收 Servert -sent事件通知
var source=new EventSource("demo-sse.php");
source.onmessage=function(event){
doucnemt.getElementById("result").innerHTML++evnt.data+"<br>";}
檢測server-Sent事件支持 if(type(EventSource)!=="undefined"){
//瀏覽器支持}else{
//瀏覽器不支持 Server-sent}
6、WebSocket是HTML5單個TCP鏈接上的全雙工通訊協議, WebSocketAPI中。瀏覽器和服務器只需要做一次握手工作,然後瀏覽器和服務器之間就形成一條快速通道,兩者之間就直接可以同數據, 介質是 JavaScript像服務器發送建立WebSocket的鏈接請求,當獲取WEbSocket 鏈接之後 通過send()方法像服務器發送數據。並通過onmessage事件來接受服務器返回的數據。
一、Html部分
HTML基礎:
1、HTML標題(heading)t通過<h1><h6>標簽定義,
eg:<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>SueKay</title>
<body>
<h1>it‘s my sister </h1>
<p>it‘s your sister</p.html
>
</body>
</html>
2、段落標<p>,</p> ,<hr >這個標簽用於對段落的分割,段落順序倒著寫<p><bdo dir="rtl">這段文字倒著顯示</bdo></p>
刪除效果<p>My favorite color is <del>blue</del> <ins>red</ins></p>
<! DOCTYPE html >
<html>
<head>it‘s my notebook</head>
<body><p>it‘s your dog </p>
<p>it‘s second <br> paragraph</p><body>
</html>
另外HTML的註釋,<!--it‘s notesiad-->,插入段落之間的水平線使用標簽<hr/>,在一個段落中實現回行,直接鍵入標簽<br>
3、HTML鏈接<a href="http://www.baidu.com">it‘s a link</a>
4、HTML圖像鏈接 <img src=“img/log/png ” width=“23” height=“23”>
5、文本格式化:對<body>中的字體進行設置<b> 粗體 <i>斜體顯示。<sub></sub>下標 <sup></sup>上標,
<pre></pre>標簽的使用保留原來文本的輸入樣式
<code></code>計算機輸出標簽樣式,<var></var >計算機變量。
<address> written by <a href="maitl:webster@example">Jon Doe</a></address>
HTML&javaSkcript&CSS&jQuery&ajax(11)