下面是关于“JS操作Cookie写入和读取实例代码”的完整攻略。
什么是Cookie
Cookie是网站可以存储在用户计算机中的小文件。这些文件包含有关用户访问网站的信息，例如登录凭据、购物车中的项目和其他首选项。
为何要使用Cookie
可以使用Cookie提供个性化用户体验、记录用户偏好并跟踪用户行为，部分网站为页面访问量和跟踪广告效果也使用Cookie。Cookie的存储是由用户浏览器进行的，因此不需要在服务器端存储任何东西。
JS如何操作Cookie
JavaScript可以通过document.cookie来操作Cookie。document.cookie是一个字符串，其中存储了页面所需的所有Cookie数据。
以下是一个用于设置Cookie的示例：
document.cookie = "username=John Doe; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/";
此代码将创建一个名为username的新Cookie，其值为John Doe。此Cookie的“过期时间”将被设置为现实生活中无限时间以避免其过期，路径被设置为页面根目录以确保其对整个网站可见。
以下是一个用于读取Cookie的示例：
function getCookie(name) {
var cookieArr = document.cookie.split(";");
for(var i = 0; i < cookieArr.length; i++) {
var cookiePair = cookieArr[i].split("=");
if(name == cookiePair[0].trim()) {
return decodeURIComponent(cookiePair[1]);
}
}
return null;
}
此代码创建了一个名为getCookie的函数。该函数接受一个字符串参数并返回与该名称相匹配的Cookie的值。如果找不到缓存名称，则返回null。
示例说明
下面有两个与Cookie相关的示例，一个用于设置Cookie，另一个用于读取Cookie。
示例1：设置Cookie
在你的网站上创建一个点击按钮的事件，使用Javascript代码将一个名为“username”的Cookie设置为“John Doe”。
HTML代码：
<!DOCTYPE html>
<html>
<body>
<button onclick="setCookie()">设置Cookie</button>
<script>
function setCookie() {
document.cookie = "username=John Doe;expires=Fri, 31 Dec 9999 23:59:59 GMT;path=/";
alert("Cookie设置成功！");
}
</script>
</body>
</html>
JavaScript代码：
function setCookie() {
document.cookie = "username=John Doe;expires=Fri, 31 Dec 9999 23:59:59 GMT;path=/";
alert("Cookie设置成功！");
}
示例2：读取Cookie
在你的网站上创建一个点击按钮的事件，使用JavaScript代码来读取名为“username”的Cookie的值。
HTML代码：
<!DOCTYPE html>
<html>
<body>
<button onclick="getCookie()">读取Cookie</button>
<script>
function getCookie() {
var cookieValue = getCookieByName("username");
if(cookieValue != null) {
alert("Cookie值为: " + cookieValue);
} else {
alert("Cookie不存在。");
}
}
function getCookieByName(cookieName) {
var cookieArray = document.cookie.split(";");
for(var i = 0; i < cookieArray.length; i++) {
var cookiePair = cookieArray[i].split("=");
if(cookieName == cookiePair[0].trim()) {
return cookiePair[1];
}
}
return null;
}
</script>
</body>
</html>
JavaScript代码：
function getCookie() {
var cookieValue = getCookieByName("username");
if(cookieValue != null) {
alert("Cookie值为: " + cookieValue);
} else {
alert("Cookie不存在。");
}
}
function getCookieByName(cookieName) {
var cookieArray = document.cookie.split(";");
for(var i = 0; i < cookieArray.length; i++) {
var cookiePair = cookieArray[i].split("=");
if(cookieName == cookiePair[0].trim()) {
return cookiePair[1];
}
}
return null;
}
以上是关于“JS操作Cookie写入和读取实例代码”的完整攻略。
本站文章如无特殊说明，均为本站原创，如若转载，请注明出处：JS操作Cookie写入和读取实例代码 - Python技术站
微信扫一扫 
支付宝扫一扫 