• HTML5--sessionStorage、localStorage、manifest


    sessionStroage:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        </script><script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
        <title>Title</title>
    </head>
    <body>
    <input type="text" id="userName" value="123"><br>
    <button id="btn1Id">设置数据</button>
    <button id="btn2Id">设置数据</button>
    <input id="btn3Id" type="button" value="设置数据"></input>
    <script type="text/javascript">
        document.querySelector("#btn1Id").onclick = function () {
            var userName = document.querySelector("#userName").value;
            window.sessionStorage.setItem("name",userName);
        };
        document.querySelector("#btn2Id").onclick = function () {
            alert(window.sessionStorage.getItem("name"));
        };
        $("#btn3Id").click(function () {
            window.sessionStorage.removeItem("name");
        });
        </script>
    </body>
    </html>
    

      localStroage

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        </script><script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
        <title>Title</title>
    </head>
    <body>
    <input type="text" id="userName" value="123"><br>
    <button id="btn1Id">设置数据</button>
    <button id="btn2Id">设置数据</button>
    <input id="btn3Id" type="button" value="设置数据"></input>
    <script type="text/javascript">
        document.querySelector("#btn1Id").onclick = function () {
            var userName = document.querySelector("#userName").value;
            window.localStorage.setItem("name",userName);
        };
        document.querySelector("#btn2Id").onclick = function () {
            alert(window.localStorage.getItem("name"));
        }
        $("#btn3Id").click(function () {
            window.localStorage.removeItem("name");
        })
    </script>
    </body>
    </html>
    

     manifest

     

    <!DOCTYPE html>
    <html lang="en" manifest="dome.appcache">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <style type="text/css">
            img{
                 300px;
                height: 100px;
                display: block;
            }
        </style>
    </head>
    <body>
    <img src="http://img.redocn.com/sheying/20150213/mulanweichangcaoyuanfengjing_3951976.jpg" alt="">
    <img src="http://pic51.nipic.com/file/20141025/8649940_220505558734_2.jpg" alt="">
    <img src="http://pic46.nipic.com/20140815/2531170_172548240000_2.jpg" alt="">
    <img src="http://pic25.nipic.com/20121112/9252150_150552938000_2.jpg" alt="">
    </body>
    </html>
    

      

  • 相关阅读:
    code of C/C++(2)
    code of C/C++ (1)
    dll 的编写和使用
    Python基础练习-数据类型与变量part2
    Python基础练习-数据类型与变量
    python基础练习-循环
    Linux grep
    nginx反向代理
    正则表达式
    Linux samba ing
  • 原文地址:https://www.cnblogs.com/eadela/p/11299356.html
Copyright © 2020-2023  润新知