Sample read and write operation of cookie in js

  • 2020-03-30 02:41:18
  • OfStack

Cookie is a small piece of information, key/value pairs of information stored in the computer hard disk of the string, cookie storage capacity of about 4kb, different browser manufacturers on the size of the limit of cookie is slightly different; The main essence of cookie is "recognition", to do something by recognition; Cookies also cannot get any other data from your hard drive, send a computer virus or get your email address. Cookies have an expiry date. The default expiry date of cookies is from cookie generation to browser closing. The expiry date of cookies can also be specified by setting the expiry date of cookies. The user can also disable the cookie or manually delete the cookie.

A cookie is a string and a text string in a particular format

Format: cookieName = cookieValue; Expires = expiresDate; Path = URLpath; Domain =siteDomain//cookie name, expiration date, stored URL, stored domain value;

How cookies are created

Setting cookies is generally encapsulated as a function:

function addCookie(sName,sValue,day) { 
var expireDate = new Date(); 
//Set failure time
document.cookie = escape(sName) + '=' + escape(sValue) +';expires=' + expireDate.toGMTString();6 //Escape () converts the character to unicode, and toGMTString() converts the date object to a string

Read the cookie

After adding the cookie, how can we get it? It's very simple:
function getCookies() { 
var showAllCookie = ''; 
if(!document.cookie == ''){ 
var arrCookie = document.cookie.split('; '); 
//With the spilt ('; ') cut all cookies stored 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 can be deleted automatically with an expiration date or immediately by setting their expiration date

Same simple, go ahead:
function removeCookie() { 
if(document.cookie != '' && confirm(' You want to clean everything up cookie ? ')) { 
var arrCookie = document.cookie.split('; '); 
var arrLength = arrCookie.length; 
var expireDate = new Date(); 
for(var i=0; i<arrLength; i++) { 
var str = arrCookie[i].split('=')[0]; 
document.cookie = str+ '=' + ';expires=' + expireDate.toGMTString(); 

Now that we know how to create, get, and delete cookies, is it time to use them

Now let's use the cookie to make a simple timer:
var cookieCount = {}; 
cookieCount.count = function () { 
var count = parseInt(this.getCount('myCount')); 
document.cookie = 'myCount=' + count + ''; 
alert(' The first '+count+' access '); 
cookieCount.setCount= function () { 
//The first step is to create a cookie called myCount
var expireDate = new Date(); 
document.cookie = 'myCount=' + '0' +';expires=' + expireDate.toGMTString(); 
cookieCount.getCount = function (countName) { 
//Gets the name count cookie and adds 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]); 
ini = false; 
if(ini == false)this.setCount(); 
return 0; 

The path of the cookie

At the beginning of this article, we mentioned the path of cookie: path=URL;

If the cookie created in the subdirectory of the domain name, the cookie cannot be accessed by the domain name and other similar or superior directories, and the advantage of setting the path is that the domain name and subdirectory of the domain name can be accessed as follows:

Document. The cookie = 'cookieName = cookieValue; Expires = expireDate; Path = / '.

The cookie domain

Set domain: domain=siteDomain

For example, "" and "" both share a domain name "". If we want the cookie under "" to be accessed by "", we need to set the path attribute to "/", and set the domain of cookie --> Document. The cookie = 'cookieName = cookieValue; Expires = expireDate; Path = /; '.

With the continuous development of the web in the project needs, it provides two properties window. The sessionStorage and window localStorage, and carry the setItem, the getItem, removeItem, methods of the clear, make local data storage method is more simple and convenient operation

Related articles: