前言
開發(fā)過程中，有時候會遇到一些類似需求，比如記住用戶在瀏覽器層面所做的操作。之前做過一個功能，當時使用了一個拖拽插件展示一個類似九宮格的報表圖，每個圖形都可以顯示和隱藏，如果用戶點擊了顯示或隱藏按鈕，那么下次進入系統(tǒng)時瀏覽器保留上一次的操作結果。核心部分是使用js對cookie進行操作，具體業(yè)務部分則是觸發(fā)點擊圖形事件時，如果是隱藏，則將該圖形對應的div從cookie中刪除，點擊顯示時，將圖形div寫入cookie。本文只記錄cookie部分操作，具體業(yè)務代碼大家可以根據(jù)自己的實際情況去寫。
什么時cookie？
- cookie有4kb大小，超出長度會返回空字符串；
- cookie存放在客戶端，可以方便的修改查看，所以不能用cookie存放重要信息；
- cooki生命周期會在關閉瀏覽器以后結束，如果要在一段事件內使用，我們可以為cookie設置有效時間；
Cookie，有時也用其復數(shù)形式 Cookies，指某些網站為了辨別用戶身份、進行 session 跟蹤而儲存在用戶本地終端上的數(shù)據(jù)（通常經過加密）。定義于 RFC2109 和 2965 中的都已廢棄，最新取代的規(guī)范是 RFC6265 [1] 。（可以叫做瀏覽器緩存）
——引用自百度百科
方法如下
1.設置cookie 參數(shù)： cname：cookie 名稱，cvalue：cookie 值 ，exdays：cookie 的過期時間
|
1
2
3
4
5
6
7
|
function setCookie(cname,cvalue,exdays){ var d = new Date(); d.setTime(d.getTime()+(exdays*24*60*60*1000)); var expires = "expires="+d.toGMTString(); document.cookie = cname + "=" + cvalue + "; " + expires;} |
2.獲取cookie
|
1
2
3
4
5
6
7
8
9
10
11
|
function getCookie(cname){ var name = cname + "="; var ca = document.cookie.split(';'); for(var i=0; i<ca.length; i++) { var c = ca[i].trim(); if (c.indexOf(name)==0) return c.substring(name.length,c.length); } return "";} |
3.刪除cookie
|
1
2
3
4
5
6
7
8
9
|
function delCookie(cname){ var exp = new Date(); exp.setTime(exp.getTime()-1); var cval = getCookie(cname); if(cval != null){ document.cookie = cname + "=" + cval + ";expires=" + exp.toGMTString(); }} |
希望這篇文章對你有所幫助，如果有用的話，記得關注我吆，后期持續(xù)為大家輸出更多內容
參考：cookie操作
總結
到此這篇關于js利用cookie實現(xiàn)記住用戶頁面操作的文章就介紹到這了,更多相關js cookie記住用戶內容請搜索服務器之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持服務器之家！
原文鏈接：https://blog.csdn.net/qq_34279303/article/details/114746509
