大佬教程收集整理的这篇文章主要介绍了（24）HTML5-窗体切换，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
@H_301_9@介绍完localStorage和sessionStoage后，基本上已经掌握了两者使用的精髓，如果还是不够清楚的话也没有关系，在这个章节的例子中，将会直接把两种存储方式设计在同一个程序中，我们就逐一地来比较在各个状态下的数据保留形式。@H_301_9@
首先在画面里设计两个字段，一个字段的数据会以“localStorag”方式存储，一个字段会以“sessionStorage”方式存储。在两个字段中分别键入数据后，按下“save”按钮，将数据分别存入两种Storage中。此时按下“F5”重新刷新网页，发现这两个字段的数据不会消失，代表已经被存储。@H_301_9@
再来单击“OpenWin”按钮，通过window。open（url）指令启动窗口，或是开一个新分页直接将网址复制过去，我们发现两个字段中的数据仍然保留着。但是在新分页中重新执行例子，sessionStorage的数据就会被清除，这证明这二者生命周期的差异。@H_301_9@
@H_301_9@
<html>
<head>
<Meta charset="utf-8"/>
<style>
</style>
<script >
function loadStorage(){
document.getElementById("local").value=window.localStorage["local"];
document.getElementById("session").value=window.sessionStorage["session"];
}
function saveToStorage(){
window.localStorage["local"]=document.getElementById("local").value;
window.sessionStorage["session"]=document.getElementById("session").value;
}
function openWindow(url){
window.open(url);
}
</script>
</head>
<body onload="loadStorage()">
local Storg<input type="text" id="local"/><br/>
session Storge<input type="text" id="session"/><br/>
<input type="button" value="Save" onclick="saveToStorage()">
<input type="button" value="OpenWin" onclick="openWindow('js.html')">
</body>
</html>
以上是大佬教程为你收集整理的（24）HTML5-窗体切换全部内容，希望文章能够帮你解决（24）HTML5-窗体切换所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。