前言
前面我们已经了解了cookie的创建、读取、修改和删除,接下来让我们试试cookie的实例吧!
cookie实例
<body>
<script>
// 设置cookie
function setCookie(key, value, expires) {
var timer = new Date();
timer.setDate(timer.getDate() + expires);
//console.log(timer);
document.cookie = key + "=" + value + ";expires=" + timer.toGMTString();
}
// 获取cookie
function getCookie(key) {
var _cookie = document.cookie;
_cookie = _cookie.split(";");
//console.log(_cookie);
for (var i = 0; i < _cookie.length; i++) {
var keyvalue = _cookie[i].split("=");
//console.log(keyvalue);
if (key = keyvalue[0].trim()) { //移除字符串两端的空格
//console.log(keyvalue[1]);
return keyvalue[1]
}
}
}
// 删除cookie
function deleteCookie(key) {
var timer = new Date();
timer.setDate(timer.getDate() - 1);
document.cookie = key + "=" + null + ";expires=" + timer.toUTCString();
}
// 测试
function test() {
var user = getCookie("username");
console.log(user);
if (user != undefined) {
alert(user + "再次访问!");
} else {
user = prompt("请输入用户名:", "");
if (user != "" && user != null)
setCookie("username", user, 1);
}
}
// setCookie("username", "nana", 1);
// setCookie("userage", 18, 1);
// getCookie();
test();
//deleteCookie("userage");
</script>
</body>
当我们运行该程序时,弹出:
此时cookie中加入了username = nana:
再次刷新该网址,cookie记录了用户名:
以上为本萌新个人总结,如有不当之处望指正,有问题可以联系
邮箱:yuna_03@163.com或
QQ:2635591841
更于2021.3.20