zoukankan      html  css  js  c++  java
  • HTML5入门7---"session的会话缓存"和"localStorage的cookie"缓存数据

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8">
            <title>第六个页面</title>
            <style>
                body{
                    font-family: "微软雅黑";
                    max-width: 600px;
                    padding: 0px 30px;
                }
                fieldset{
                    margin-bottom: 15px;
                    padding: 10px;
                }
                legend{
                    padding: 0px 3px;
                    font-weight: bold;
                    font-variant: small-caps;
                }
                label{
                    width:140px;
                    display: inline-block;
                    vertical-align: top;
                    margin: 6px;
                }
                input{
                    margin-top: 12px;
                    width: 300px;
                }            
            </style>
            <script type="text/javascript">
                function saveData(){
                    var name = document.getElementById("name");
                    var age = document.getElementById("age");
                    localStorage.setItem("localData",name.value);
                    sessionStorage.setItem("sessionData",age.value);                
                }
                function loadData(){
                    var name = document.getElementById("name");
                    var age = document.getElementById("age");
                    var localData = localStorage.getItem("localData");
                    var sessionData = sessionStorage.getItem("sessionData");
                    if(localData != null){
                        name.value = localData;
                    }
                    if(sessionData != null){
                        age.value = sessionData;
                    }
                }
            </script>
        </head>
        <body>
            <fieldset>
                <legend>Web Storage</legend>
                <label>姓名</label>
                <input id="name" type="text" value="" /><br/>
                <label>年龄</label>
                <input id="age" type="number" value="" />            
            </fieldset>
            <div>
                <button onclick="saveData()">Save</button>
                <button onclick="loadData()">Load</button>
            </div>
        </body>
    </html>
  • 相关阅读:
    BigDecimal.setScale 处理java小数点
    JS判断用户手机是IOS还是Android
    h5 移动端 监听软键盘弹起、收起
    【java】查重类的实现
    MySQL ORDER BY IF() 条件排序
    版本回退
    Log4j 配置某个类中某个方法的输出日志到指定文件
    简单地实现文章的查重
    simhash算法
    mysql中 for update 使用
  • 原文地址:https://www.cnblogs.com/beautiful-code/p/5067136.html
Copyright © 2011-2022 走看看