小編給大家分享一下js實(shí)現(xiàn)操作cookie的常見方法有哪些，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！
成都創(chuàng)新互聯(lián)公司主要從事做網(wǎng)站、成都網(wǎng)站建設(shè)、網(wǎng)頁設(shè)計(jì)、企業(yè)做網(wǎng)站、公司建網(wǎng)站等業(yè)務(wù)。立足成都服務(wù)和平,十載網(wǎng)站建設(shè)經(jīng)驗(yàn),價(jià)格優(yōu)惠、服務(wù)專業(yè),歡迎來電咨詢建站服務(wù):18980820575
具體如下：
js操作cookie，可以通過開源的插件實(shí)現(xiàn)，方便快捷，兼容性好，同樣也可以自己寫；
此文主要介紹兩個(gè)常用的插件：Js.cookie.js 和 jQuery.cookie.js
js.cookie.js : 一個(gè)簡(jiǎn)單，輕量級(jí)的JavaScript API，用于處理cookie;
下載地址：https://github.com/js-cookie/js-cookie/releases
優(yōu)點(diǎn)：
適用于所有瀏覽器；
接受任何字符；
沒有依賴；
支持ES模塊；
Unobtrusive JSON support；
Enable custom encoding/decoding；
創(chuàng)建一個(gè)cookie，整個(gè)站點(diǎn)可用；
重慶分公司
重慶分公司
Cookies.set('name', 'value');創(chuàng)建一個(gè)cookie，有效期為4天，整個(gè)站點(diǎn)可用；
Cookies.set('name', 'value', { expires: 4 });注意：
expires的單位默認(rèn)為“天”，那如何設(shè)置有效期小于1天呢？
解決方案如下：
//設(shè)置cookie有效期為15分鐘；
var inFifteenMinutes = new Date(new Date().getTime() + 15 * 60 * 1000);
Cookies.set('foo', 'bar', {
expires: inFifteenMinutes
});創(chuàng)建一個(gè)cookie，有效期為4天，且只在當(dāng)前頁面所在的路徑有效；
Cookies.set('name', 'value', { expires: 4, path: '' })舉例解釋一下，
在 http://127.0.0.1/path2/test.html頁面中設(shè)置cookie，且cookie的path設(shè)為"",那么在 http://127.0.0.1/test.html 這個(gè)頁面中是獲取不到那個(gè)cookie的，而在 http://127.0.0.1/path2/path3/test.html 這個(gè)頁面中是可以獲取到那個(gè)cookie的；
下面的兩種寫法，效果是一樣的，整個(gè)站點(diǎn)可用；
Cookies.set('name', 'value', { expires: 4 });
Cookies.set('name', 'value', { expires: 4, path: '/' });讀取某個(gè)cookie：
Cookies.get('name') // => 'value'
Cookies.get('nothing') // => undefined讀取所有可見cookie：返回的是個(gè)json對(duì)象；
Cookies.get() // => { name: 'value' , name1: 'value1' }刪除某個(gè)cookie：
Cookies.remove('name')刪除當(dāng)前頁面所在路徑下某個(gè)有效的cookie：
Cookies.set('name', 'value', { path: '' })
Cookies.remove('name') // fail!
Cookies.remove('name', { path: '' }) // removed!注意：在路徑path2下的頁面中設(shè)置了個(gè)cookie，路徑設(shè)為path2/path3
Cookies.set('name', 'value', { path: 'path2/path3' });但在路徑path2/path3中的頁面中是無法刪除這個(gè)cookie的，只能到路徑path2下的頁面中去刪除：
Cookies.remove('name', { path: 'path2/path3' });當(dāng)穿件cookie時(shí)，可以將Array或Object作為值；
Cookies.set('name', { foo: 'bar' });讀取cookie值：
Cookies.get('name') // => '{"foo":"bar"}'
Cookies.get() // => { name: '{"foo":"bar"}' }Cookies.getJSON('name') // => { foo: 'bar' }
Cookies.getJSON() // => { name: { foo: 'bar' } }Jquery.cookie.js - A simple, lightweight jQuery plugin for reading, writing and deleting cookies；
Jquery.cookie.js - 一個(gè)簡(jiǎn)單，輕量的jquery插件，用于cookie的讀取、寫入和刪除操作；
下載地址：http://plugins.jquery.com/cookie/
Github地址：https://github.com/carhartl/jquery-cookie
注意：使用之前要引入jquery.js;
創(chuàng)建一個(gè)cookie，當(dāng)前頁面路徑有效；
$.cookie('cookieName', 'cookieValue');此處有坑，舉例解釋一下，
在 http://127.0.0.1/path2/test.html頁面中這樣設(shè)置cookie，$.cookie('cookieName', 'cookieValue'),那么在 http://127.0.0.1/test.html 這個(gè)頁面中是獲取不到那個(gè)cookie的，而在 http://127.0.0.1/path2/path3/test.html 這個(gè)頁面中是可以獲取到那個(gè)cookie的；
創(chuàng)建一個(gè)cookie，全站點(diǎn)有效；
$.cookie('name', 'value', { path: '/' });創(chuàng)建一個(gè)cookie，有效期為4天；
$.cookie('cookieName', 'cookieValue', { expires: 4 });注意：
expires的單位默認(rèn)為“天”，那如何設(shè)置有效期小于1天呢？
解決方案如下：
//設(shè)置cookie有效期為15分鐘；
var inFifteenMinutes = new Date(new Date().getTime() + 15 * 60 * 1000);
$.cookie('cookieName', 'cookieValue', { expires: inFifteenMinutes });創(chuàng)建一個(gè)cookie，并設(shè)置cookie的有效路徑：
$.cookie('name', 'value', { expires: 4, path: '/website1' });該cookie只在website1站點(diǎn)下有效；
讀取某個(gè)cookie：
$.cookie('name'); // => "value"
$.cookie('nothing'); // => undefined讀取所有有效的cookie：（json格式）
$.cookie(); // => { "name": "value","name1":"value1" }// 成功刪除返回true，失敗返回false；
$.removeCookie('name'); // => true
$.removeCookie('nothing'); // => false
// 刪除時(shí)，必須使用創(chuàng)建時(shí)設(shè)置的屬性值（path，domain 等）
$.cookie('name', 'value', { path: '/' });
// 失敗
$.removeCookie('name'); // => false
// 成功
$.removeCookie('name', { path: '/' }); // => truecookie是否編碼；（using encodeURIComponent/decodeURIComponent）
$.cookie.raw = true;
是否以json格式進(jìn)行存儲(chǔ)和讀??；（Assumes JSON.stringify and JSON.parse）
$.cookie.json = true;
以上是“js實(shí)現(xiàn)操作cookie的常見方法有哪些”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！
