• HTML5---21.SessionStorage的应用


    sessionStorage的几个特点
        1.存储大小:5Mb
        2.存储数据在当前页面的内存中
        3.生命周期:关闭当前页面就销毁了
    常用的方法
        setItem()添加
        removeItem() 删除   
        getItem() 获取
    sessionStorage可以在浏览器调试 Application里面的 Storage里面查看
    
    <body>
        <input type="text" name="username" id="name">
        <input type="button" value="添加" id="add">
        <input type="button" value="删除" id="remove">
        <input type="button" value="获取" id="get">
    </body>
    <script>
        document.querySelector("#add").onclick = function () {
            var name = document.querySelector("#name").value;
            sessionStorage.setItem("username",name);
        }
        document.querySelector("#remove").onclick = function () {
            sessionStorage.removeItem("username");
        }
        document.querySelector("#get").onclick = function () {
           var nam = sessionStorage.getItem("username");
            alert(nam);
        }
    </script>
    

    浏览器渲染效果:

    <body> <input type="text" name="username" id="name"> <input type="button" value="添加" id="add"> <input type="button" value="删除" id="remove"> <input type="button" value="获取" id="get"> </body> <script> document.querySelector("#add").onclick = function () { var name = document.querySelector("#name").value; sessionStorage.setItem("username",name); } document.querySelector("#remove").onclick = function () { sessionStorage.removeItem("username"); } document.querySelector("#get").onclick = function () { var nam = sessionStorage.getItem("username"); alert(nam); } </script>
  • 相关阅读:
    读写excel文件
    数据库操作
    django项目搭建
    django基础
    string
    random函数
    vue-typescript入门
    Visual Studio 2019配置vue项目
    js css+html实现简单的日历
    python接口自动化4-绕过验证码登录(cookie)
  • 原文地址:https://www.cnblogs.com/Tobenew/p/10511444.html
Copyright © 2020-2023  润新知