zoukankan      html  css  js  c++  java
  • HMTL5 Web存储的localStorage的使用实例【图文说明】

    使用HTML5 Web存储的localStorage方式进行编写一个Web页面。

    功能是一个简易的Web留言板。留言板信息可以永久保存。并能清楚留言板内容。参考页面如下图:

    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title></title>
        <style type="text/css">
            textarea {
                width: 500px;
                height: 200px;
            }
        </style>
    </head>
    <body>
        <div>
            <h2>简单的web存储留言板</h2>
            <textarea id="t1"></textarea>
            <br />
            <input type="button" class="button" onclick="addInfo()" value="留言" />
            <input type="button" class="button" onclick="cleanInfo()" value="清除留言" />
            <br />
            <hr />
            <label id="shows"></label>
            <textarea id="show" readonly="readonly"></textarea>
        </div>
        <script type="text/javascript">
            //使用HTML5 Web存储的localStorage方式进行编写一个Web页面。
            //功能是一个简易的Web留言板。留言板信息可以永久保存。并能清楚留言板内容。参考页面如下图:
    
            function upInfo() {
                var lStorage = window.localStorage;
                var show = window.document.getElementById("show");
                if (window.localStorage.myBoard) {
                    show.value = window.localStorage.myBoard;
                }
                else {
                    var info = "还没有留言";
                    show.value = "还没有留言";
                }
            }
    
            function addInfo() {
                var info = window.document.getElementById("t1");
                var lStorage = window.localStorage;
                if (lStorage.myBoard) {
                    var date = new Date();
                    lStorage.myBoard += t1.value + "\n发表时间:" + date.toLocaleString() + "\n";
                }
                else {
                    var date = new Date();
                    lStorage.myBoard = t1.value + "\n发表时间:" + date.toLocaleString() + "\n";
                }
    
                upInfo();
            }
            function cleanInfo() {
                window.localStorage.removeItem("myBoard");
                upInfo();
            }
            upInfo();
        </script>
    
    </body>
    </html>
  • 相关阅读:
    设计模式总结
    内存模型
    运行时内存
    网络
    iOS安全攻防(十)dump自己的app
    iOS安全攻防(九)使用Theos开发SpringBoard的Tweat
    iOS安全攻防(八)Thoes的Logos简介
    iOS安全攻防(七)使用iOSOpenDev开发SpringBoard的Tweat
    iOS安全攻防(六)使用class-dump导出Frameworks头文件
    iOS安全攻防(五)使用dpkg安装deb到iOS设备
  • 原文地址:https://www.cnblogs.com/taoweiji/p/2809083.html
Copyright © 2011-2022 走看看