javascript 中Cookie讀、寫與刪除操作
javascript 中Cookie讀、寫與刪除操作
前言:
在這個(gè)前端橫行的時(shí)候,頁(yè)面之間的交互需要數(shù)據(jù)的傳遞,有的數(shù)據(jù)通過url傳參的形式可以很好地解決,但是對(duì)于部分需要改變的參數(shù),你如說從頁(yè)面A到頁(yè)面B選擇數(shù)據(jù),然后從頁(yè)面B將數(shù)據(jù)再傳到頁(yè)面A(典型的栗子就是收貨地址的選擇),針對(duì)這一塊我是通過存儲(chǔ)cookie來解決的。
對(duì)于cookie的操作我給出了一些簡(jiǎn)單的封裝,當(dāng)然也借鑒了前輩們經(jīng)驗(yàn),自己糅合了一下,對(duì)于cookie的操作,無非是讀寫和刪除,我們首先來看一下寫的操作,有寫才有讀,進(jìn)而進(jìn)行刪除等操作。
/** * 設(shè)置COOKIE * @param name 設(shè)置cookie的屬性名 * @param value 設(shè)置cookie的屬性值 * @param time 設(shè)置cookie的時(shí)間 */ function setCookie(name, value , time) { time = time ? parseFloat(time) : 0 ; var exp = new Date(); exp.setTime(exp.getTime() + time); // escape 這種編碼方式過時(shí)了 改用 encodeURIComponent // document.cookie = name + "=" + escape(value) + ";expires=" + (time ? exp.toGMTString() : 'session'); document.cookie = name + "=" + encodeURIComponent(value) + ";expires=" + (time ? exp.toGMTString() : 'session'); }
我們有了寫的操作了,那么我們?cè)賮砜纯磳?duì)于讀的操作。
/** * 獲取cookie * @param name * @returns {null} */ function getCookie(name) { var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)"); if (arr = document.cookie.match(reg)) //unescape這種解碼方式好像過時(shí)了,可以采用decodeURIComponent解碼方式 //return unescape(arr[2]); return decodeURIComponent(arr[2]); else return null; }
接下就是對(duì)cookie的刪除操作了,其實(shí)這個(gè)操作很簡(jiǎn)單,就是將cookie設(shè)置過期,cookie就自動(dòng)失效了
/** * 刪除cookie * @param name */ function delCookie(name) { var exp = new Date(); exp.setTime(exp.getTime() - 1); var cval = getCookie(name); if (cval != null) document.cookie = name + "=" + cval + ";expires=" + exp.toGMTString(); }
以上就是對(duì)cookie的一些簡(jiǎn)單操作
接下來我們來談一點(diǎn)cookie的深層次的問題:cookie的跨域
Js跨域同步cookie怎么實(shí)現(xiàn) document.cookie = "name=" + "value;" + "expires=" + "datatime;" + "domain=" + "" + "path=" + "/path" + "; secure"; /** * 刪除cookie * value Cookie值 * expires 有效期截至(單位毫秒) * path 子目錄 * domain 有效域 * secure 是否安全 */ <iframe src='http://網(wǎng)站:1234/test/Index' width='100' height='100' style="display:none"></iframe> /* *原頁(yè)面js里 window.location = "http://另外一個(gè)網(wǎng)站:1234/GetCookie/Index?" + document.cookie;跳到另外一個(gè)站,另外一個(gè)站獲取cookie,設(shè)置cookie */ var url = window.location.toString();//獲取地址 var get = url.substring(url.indexOf("liuph"));//獲取變量和變量值 var idx = get.indexOf("=");//獲取變量名長(zhǎng)度 if (idx != -1) { var name = get.substring(0, idx);//獲取變量名 var val = get.substring(idx + 1);//獲取變量值 setCookie(name, val, 1);//創(chuàng)建Cookie }
以上就是今天對(duì)cookie的解讀。
感謝閱讀,希望能幫助到大家,謝謝大家對(duì)本站的支持!
- JS實(shí)現(xiàn)Cookie讀、寫、刪除操作工具類示例
- javascript 操作cookies詳解及實(shí)例
- javascript操作cookie
- Javascript 對(duì)cookie操作詳解及實(shí)例
- JS中對(duì)Cookie的操作詳解
- JS封裝cookie操作函數(shù)實(shí)例(設(shè)置、讀取、刪除)
- javascript操作Cookie(設(shè)置、讀取、刪除)方法詳解
- js中的cookie的讀寫操作示例詳解
- JS操作Cookie寫入和讀取實(shí)例代碼
- JS操作Cookies包括(讀取添加與刪除)
- JavaScript實(shí)現(xiàn)cookie的操作
相關(guān)文章
ES6下javascript解構(gòu)賦值常見用法總結(jié)
這篇文章主要介紹了在ES6下javascript賦值常見用法總結(jié),需要的朋友可以參考下2022-01-01一起來看看js對(duì)象和事件的學(xué)習(xí)筆記
這篇文章主要為大家詳細(xì)介紹了js對(duì)象和事件學(xué)習(xí)筆記,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下,希望能夠給你帶來幫助2022-02-02javascript中hasOwnProperty() 方法使用指南
這篇文章主要詳細(xì)介紹了javascript中hasOwnProperty() 方法使用指南,非常的全面,推薦給有需要的小伙伴參考下。2015-03-03網(wǎng)頁(yè)收藏夾顯示ICO圖標(biāo)(代碼少)
在添加網(wǎng)頁(yè)到收藏夾之后會(huì)看到一個(gè)漂亮的圖標(biāo),很好奇是怎么實(shí)現(xiàn)的呢?下面小編就給大家講解下網(wǎng)頁(yè)收藏夾顯示ICO圖標(biāo)(代碼少),有需要的小伙伴可以來參考下2015-08-08簡(jiǎn)述JavaScript的正則表達(dá)式中test()方法的使用
這篇文章主要介紹了簡(jiǎn)述JavaScript的正則表達(dá)式中test()方法的使用,是JS入門學(xué)習(xí)中的基礎(chǔ)知識(shí),需要的朋友可以參考下2015-06-06JavaScript中的正則表達(dá)式簡(jiǎn)明總結(jié)
這篇文章主要介紹了JavaScript中的正則表達(dá)式,簡(jiǎn)明總結(jié)了正則中的語(yǔ)法含義和RegExp對(duì)象,需要的朋友可以參考下2014-04-04Javascript中常見的校驗(yàn)如域名、手機(jī)、郵箱等等
Javascript中常見的校驗(yàn)如:驗(yàn)證一般域名校驗(yàn),手機(jī)校驗(yàn),郵箱校驗(yàn)等等,下面是具體的實(shí)現(xiàn),感興趣的朋友可以參考下2014-01-01