HTML5 ? ???
HTML5 ? ????
HTML5? ???? ???? ?? ???? ??? ??? ? ????.
???? ?? ????? ??? ??????. ??? ? ????? ?? ???? ??? ???. ???? ??? ???? ??? ???? ???? ???? ??? ?? ???? ?????. ?? ???? ??? ??? ?? ?? ?? ?? ???? ??? ?? ????.
HTML5 ?? ???? Web Storage
Web Storage? HTML5?? ??? ?? ??? ???? ??? ?? ?????- ???? HTML4 ??? ???? ?????? ??? ??? ? ??? ???? ?? ? ??? ? ????. ?? ??? 4KB? ???? ? ??????? ????? ? ????? 5MB? ?????. Web Storage? ? ?? ???? ??????.
sessionStorage
localStorage
? ??? ? ? ????. sessionStorage? ??? ???? ???? ????? ??? ???? ??, localStorage? ???? ????? ???? ?? ? sessionStorage?? ??? ???? ???? ???? ????. localStorage?? ??? ? ?? API? ?????.
??? ??: localStorage.setItem( key, value ); value );
??? ??: localStorage.getItem( key ); sessionStorage.getItem( key );
?? ??? ??: localStorage.removeItem( key );
?? ??? ??: localStorage.clear( ); sessionStorage.clear( );
??? ? ????: localStorage.key( index );
? ?? ? ?, ? ? ??? ???? ?? ??? ????.
var keyLength1 = localStorage.length; var keyLength2 = sessionStorage . length;
?? ?? ?? ?? ?? ?????? ???. ?, ? ???? API? ?????? ??? ? ????.
? ???? ???? ?? ????? localStorage ? sessionStorage? ????? ???? ???.
if(typeof(Storage)! ==="???? ??")
{ // ?! localStorage sessionStorage ??? ?????!
// ?? ??....
} else {
// ?????. ? ????? ???? ????.
}
?:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>HTML5--本地存儲(chǔ)</title>
<script>
function clickCounter()
{
if(typeof(Storage)!=="undefined")
{
if (localStorage.clickcount)
{
localStorage.clickcount=Number(localStorage.clickcount)+1;
}
else
{
localStorage.clickcount=1;
}
document.getElementById("result").innerHTML=" 你已經(jīng)點(diǎn)擊了按鈕 " + localStorage.clickcount + " 次 ";
}
else
{
document.getElementById("result").innerHTML="對(duì)不起，您的瀏覽器不支持 web 存儲(chǔ)。";
}
}
</script>
</head>
<body>
<p><button onclick="clickCounter()" type="button">點(diǎn)我！</button></p>
<div id="result"></div>
<p>點(diǎn)擊該按鈕查看計(jì)數(shù)器的增加。</p>
<p>關(guān)閉瀏覽器選項(xiàng)卡(或窗口),重新打開此頁面,計(jì)數(shù)器將繼續(xù)計(jì)數(shù)(不是重置)。</p>
</body>
</html>
