效果
发送方
接收方
localStorage 的使用
// 保存数据
localStorage.setItem('key', value);
// 获取数据
localStorage.getItem('key');
发送方
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>登录</title>
</head>
<body>
<form action="input_test_action.html" method="post"
onsubmit="return f()">
<p>
用户名:<input type="text" name="username" id="username">
</p>
<p>
密码:<input type="text" name="pwd" id="pwd">
</p>
<p>
<input type="reset"> <input type="submit">
</p>
</form>
<script>
function f()
{
var username = document.getElementById('username');
var pwd = document.getElementById('pwd');
localStorage.setItem('username', username.value);
localStorage.setItem('pwd', pwd.value);
}
</script>
</body>
</html>
接收方
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>登录结果</title>
</head>
<body>
<p>Username: <span id="username"></span></p>
<p>Password: <span id="pwd"></span></p>
<script>
const username = localStorage.getItem('username');
const pwd = localStorage.getItem('pwd');
// 将数据渲染到页面上
document.getElementById('username').textContent = username;
document.getElementById('pwd').textContent = pwd;
</script>
</body>
</html>