大家好这里是X，最近依旧是忙碌的几乎没有自己的时间了，今天带来JavaScript中使用document操作cooie的小项目功能。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>使用cookie记住登陆用户名</title>
<script>
window.onload = function(){
var oUsername = document.getElementById('username');
var oLogin = document.getElementById('login');
var oDel = document.getElementById('del');
//判断用户是否曾经登录过
if(getCookie('username')){
oUsername.value = getCookie('username');
}
//定义一个函数来获取指定名称的cookie值：
function getCookie(key){
var arr1 = document.cookie.split(';');
for(var i = 0; i < arr1.length; i++){
var arr2 = arr1[i].split('=');
if(arr2[0] == key){
return unescape(arr2[1]);//对编码后的内容进行解码
}
}
}
//定义一个函数来设置cookie,同时设置cookie的过期时间
function setCookie(key,value,t){
var oDate = new Date();
oDate.setDate(oDate.getDate()+t);
//使用escape()对内容进行编码
document.cookie = key+'='+escape(value)+';expires='+oDate.toGMTString();
//在这里我们对获得的cookie进行“加密”、设置过期时间,设置好cookie格式
}
//定义一个函数移除cookie
function removeCookie(key){
setCookie(key,'',-1);
}
oLogin.onclick = function(){
alert('登录成功');
//将输入的用户名存储在cookie中，且在登录五天后cookie过期
setCookie('username',oUsername.value,5);//一过来就设置加密和过期时间
}
oDel.onclick = function(){
removeCookie('username');
oUsername.value = '';//移除cookie后清空文本框内容
}
};
</script>
</head>
<body>
<input type="text" id="username"/>
<input type="button" value="登陆" id="login"/>
<input type="button" value="删除用户名cookie" id="del"/>
</body>
</html>
如果说你关闭当前的页面，然后再打开，会发现输入框中还存在你上次页面的那个用户名xmonster🥟
删除后再打开就不会有了🥠比较简单