localStorage的存储功能

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="js/jquery-3.2.1.min.js"></script>
<script type="text/javascript">
    function MyClick1(){
        var username=$("#txtUserName").val();
        var pwd=$("#txtPwd").val();
    //sessionStorage存储周期:当前页面
    //    sessionStorage.setItem("k_username",username);
    //    sessionStorage.setItem("k_pwd",pwd);
    
        localStorage.setItem("k_username",username);
        localStorage.setItem("k_pwd",pwd);    
    
        alert("存储成功");
    }
    
    function MyClick2(){
    //    alert(sessionStorage.getItem("k_username"));
    //    alert(sessionStorage.getItem("k_pwd"));
        //localStorage 将内容存在本地,不会随着浏览器窗口的关闭被清楚,可手动删除
        localStorage.removeItem("k_username");
        localStorage.clear();
        
        alert(localStorage.getItem("k_username"));
        alert(localStorage.getItem("k_pwd"));
        
    }
    
</script>
</head>
<body>
    <input type="text" id="txtUserName"/><br>
    <input type="password" id="txtPwd"/><br>
    <input type="button" value="按钮1" onclick="MyClick1();"/>
    <input type="button" value="按钮2" onclick="MyClick2();"/>
    
</body>
</html>

posted on 2017-05-09 20:21  河狸筑坝  阅读(79)  评论(0编辑  收藏  举报