Detailed example of reading and writing cookies in js_javascript skills

A cookie is a small piece of information, a string of key/value pairs stored on the computer's hard drive. The storage capacity of a cookie is about 4kb. Different browser manufacturers have slightly different restrictions on cookie size; the main features of cookies The essence is "identification" and doing something through identification; cookies cannot obtain any other data from your hard drive, transmit computer viruses or obtain your email address. Cookies have a validity period. The default validity period of a cookie is from when the cookie is generated to when the browser is closed. You can also specify the expiration date by setting the validity period of the cookie. Users can also disable cookies or manually delete cookies.

Cookie is a string and a text string in a specific format

Format: cookieName=cookieValue;expires=expiresDate;path=URLpath;domain=siteDomain//cookie name, expiration date, Store the URL and store the domain value;

How to create cookies

We generally encapsulate cookie settings into a function:

Copy code The code is as follows:

function addCookie(sName,sValue,day) {
var expireDate = new Date();
expireDate.setDate(expireDate.getDate() day);;
//Set expiration time
document.cookie = escape(sName) '=' escape(sValue) ';expires=' expireDate.toGMTString() ;6 //escape() convert Chinese characters into unicode encoding, toGMTString() convert date object into string
}

Read cookie

After adding the cookie, how do we get it? It’s very simple:

Copy code The code is as follows:

function getCookies() {
var showAllCookie = '';
if(!document.cookie == ''){
var arrCookie = document.cookie.split('; ');
//Use split('; ') to cut all cookies and save them in the array arrCookie
var arrLength = arrCookie.length;
for(var i=0; i<arrLength; i ) {
showAllCookie = 'c_name:' unescape(arrCookie[i].split('=')[0]) 'c_value:' unescape(arrCookie[i].split('=')[1]) '<br>' 9 }
return showAllCookie;
}
}

Cookies have a validity period and can be automatically deleted, or they can be deleted immediately by setting their expiration date.

Same as Simple, continue:

Copy code The code is as follows:

function removeCookie() {
if(document.cookie != '' && confirm('Do you want to clear all cookies? ')) {
var arrCookie = document.cookie.split('; ');
var arrLength = arrCookie.length;
var expireDate = new Date();
expireDate.setDate(expireDate .getDate()-1);
for(var i=0; i<arrLength; i ) {
var str = arrCookie[i].split('=')[0];
document .cookie = str '=' ';expires=' expireDate.toGMTString();
}
}
}

We already know how to create, obtain, and delete cookies , now it’s time to use cookies

Let’s use cookies to make a simple timer:

Copy code The code is as follows:

var cookieCount = {};
cookieCount.count = function () {
var count = parseInt(this.getCount('myCount'));
count ;
document.cookie = 'myCount=' count '';
alert('count 'visits');
}
cookieCount.setCount= function () {
/ /First create a cookie named myCount
var expireDate = new Date();
expireDate.setDate(expireDate.getDate() 1);
document.cookie = 'myCount=' '0' ';expires=' expireDate.toGMTString();
}
cookieCount.getCount = function (countName) {
//Get the cookie named count and add 1 to it
var arrCookie = document. cookie.split('; ');
var arrLength = arrCookie.length;
var ini = true;
for(var i=0; i<arrLength; i ) {
if(countName == arrCookie[i].split('=')[0]){
return parseInt(arrCookie[i].split('=')[1]);
break;
}else {
ini = false;
}
}
if(ini == false)this.setCount();
return 0;
}
cookieCount.count() ;

Cookie path

The cookie path was mentioned at the beginning of this article. Set the cookie path: path=URL;

If it is created in a subdirectory of the domain name Cookies, domain names and other sibling or superior directories cannot access this cookie. The advantage of setting the path is that it can access the domain name and subcategory directories of the domain name, as follows:

document. cookie='cookieName=cookieValue;expires=expireDate;path=/'.

cookie domain

Set domain: domain=siteDomain

This is mainly used to share a cookie in the same domain, such as "www.taobao .com" and "ued.taobao.com" share the same domain name "taobao.com". If we want the cookies under "www.taobao.com" to be accessed by "ued.taobao.com", then we need to Set the path attribute to "/", and set the domain of the cookie-->document.cookie='cookieName=cookieValue;expires=expireDate;path=/;domain=taobao.com'.

With the continuous development of web projects, HTML5 provides two properties, window.sessionStorage and window.localStorage, and carries methods such as setItem, getItem, removeItem, clear, etc., making it possible to store data locally. Operation is simpler and more convenient