HTML 5 基础教程

HTML是超文本标记语言，是一种专门用来制作网页的语言，而HTML5就是它的第五个版本，2014年10月29日，万维网联盟宣布，经过接近8年的艰苦努力，该标准规范终于制定完成，该标准针对当前互联网的飞速发展制定了更加标准的网页语言规范及适用功能，同时也给我们开发者带来了更多的开发选择，学习它是每个前端开发者必修的课程。

W3CAPI

2020-05-15 07:13:27

HTML5 sessionStorage 数据存储实例

sessionStorage 方法针对一个 session（会话，一个网站的请求）进行数据存储。当用户关闭浏览器窗口后，数据会被浏览器自动删除；适用于临时数据的存储。

一、使用 sessionStorage 存储字符串、数组、对象

<p><button onclick="clickCounter()" type="button">请点击这里</button></p>
<div id="result"></div>
<p>请点击按钮使计数器递增。</p>
<p>请关闭浏览器或标签页，然后再试一次，计数器会重置。</p>

<script type="text/javascript">
    function clickCounter() {
        if(typeof(Storage) !== "undefined") {
            if (sessionStorage.clickcount) {
                sessionStorage.clickcount = Number(sessionStorage.clickcount)+1;
            } else {
                sessionStorage.clickcount = 1;
            }
            document.getElementById("result").innerHTML = "在当前 session（会话） 中，您已经点击这个按钮 " + sessionStorage.clickcount + " 次。";
        } else {
            document.getElementById("result").innerHTML = "您的浏览器不支持 Web Storage ...";
        }
    }
</script>

执行一下

二、使用 sessionStorage 实现页面在当前session（网页会话）中访问次数的记录

<p>刷新页面会看到计数器在增长。</p>
<p>请关闭浏览器窗口，然后再试一次，计数器已经重置了。</p>

<script type="text/javascript">

    if (sessionStorage.pagecount)  {
        sessionStorage.pagecount=Number(sessionStorage.pagecount) +1;
    }
    else  {
        sessionStorage.pagecount=1;
    }
    document.write("您访问了该页面第 " + sessionStorage.pagecount + " 次.");

</script>

执行一下