<!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>
原文：http://www.cnblogs.com/gf36500/p/6832472.html