Implementation steps of using JS to operate HTTP Cookies

We know that cookie has a validity period. The default validity period of a cookie is from the time the cookie is generated until the browser is closed. We can set the validity period of the cookie to specify its expiration date. Users can also Disabling cookies can also delete cookies manually.

A cookie is a small piece of information, a string stored on the computer hard drive as a key/value pair. The cookie storage capacity is approximately 4kb. Different browser manufacturers have different limits on cookie size. The restrictions are slightly different; the main essence of cookies is to "identify" and do 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

格式：cookieName=cookieValue;expires=expiresDate;path=URLpath;domain=siteDomain//cookie名称，失效日期，储存URL,储存域值；

How to create a cookie
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);;
//设置失效时间
document.cookie = escape(sName) + '=' + escape(sValue) +';expires=' + expireDate.toGMTString();6 //escape()汉字转成unicode编码,toGMTString() 把日期对象转成字符串
}

Read cookie
After adding cookie, how do we get it? It is very simple:

Copy code code As follows:

function getCookies() {
var showAllCookie = '';
if(!document.cookie == ''){
var arrCookie = document.cookie.split('; ');
//用spilt('; ')切割所有cookie保存在数组arrCookie中
var arrLength = arrCookie.length;
for(var i=0; i<arrLength; i++) {
showAllCookie += &#39;c_name:&#39; + unescape(arrCookie[i].split(&#39;=&#39;)[0]) + &#39;c_value:&#39; + unescape(arrCookie[i].split(&#39;=&#39;)[1]) + &#39;<br>&#39; 9 }
return showAllCookie;
}
}

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

It’s very simple, continue:

Copy code code As follows:

function removeCookie() { if(document.cookie != &#39;&#39; && confirm(&#39;你想清理所有cookie吗？&#39;)) { var arrCookie = document.cookie.split(&#39;; &#39;); 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(&#39;=&#39;)[0]; document.cookie = str+ &#39;=&#39; + &#39;;expires=&#39; + expireDate.toGMTString(); } } }

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

Let’s use cookies to make a simple timer:

Copy the code code as follows:

var cookieCount = {}; cookieCount.count = function () { var count = parseInt(this.getCount(&#39;myCount&#39;)); count++; document.cookie = &#39;myCount=&#39; + count + &#39;&#39;; alert(&#39;第&#39;+count+&#39;访问&#39;); } cookieCount.setCount= function () { //首先得创建一个名为myCount的cookie var expireDate = new Date(); expireDate.setDate(expireDate.getDate()+1); document.cookie = &#39;myCount=&#39; + &#39;0&#39; +&#39;;expires=&#39; + expireDate.toGMTString(); } cookieCount.getCount = function (countName) { //获取名为计数cookie,为其加1 var arrCookie = document.cookie.split(&#39;; &#39;); var arrLength = arrCookie.length; var ini = true; for(var i=0; i<arrLength; i++) { if(countName == arrCookie[i].split(&#39;=&#39;)[0]){ return parseInt(arrCookie[i].split(&#39;=&#39;)[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 in The cookie created by the subdirectory of the domain name cannot be accessed by the domain name and other sibling directories or superior directories. The advantage of setting the path is that it can be accessed by 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" both share a 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 cookie

domain-->document.cookie='cookieName=cookieValue;expires=expireDate;path=/;domain=taobao.com'。

With the continuous development of the web project, HTML5 provides two attributes window.sessionStorage and window.localStorage, and carries setItem, getItem, removeItem, clear and other methods, making the method of storing data locally easier and more convenient

I believe you have read these You have mastered the case method. For more exciting information, please pay attention to other related articles on the PHP Chinese website!

Related reading:

An example tutorial of margin-top in web page production

The difference between the types of box models in CSS

CSS3 content attribute implementation steps

The above is the detailed content of Implementation steps of using JS to operate HTTP Cookies. For more information, please follow other related articles on the PHP Chinese website!