天天看點

JS設定cookie、讀取cookie、删除cookieJS  設定cookie、讀取cookie、删除cookie

JS  設定cookie、讀取cookie、删除cookie

通常浏覽器在第一次頁面加載時候會幫我們把網站的圖檔資料等資訊緩存下來。當使用者在一段時間内重複登陸該網站的時候可以直接引用緩存的資訊加快加頁面渲染速度,減少伺服器壓力,大大提高加載速度,提高使用者體驗。

本人經過測試感覺還不錯。

PS:友情提示,請在 伺服器環境 下測試,非伺服器環境下是沒辦法的~

完成後可以打開浏覽器控制台檢視是否列印~

(function() {
        var isHasCookei = getCookie("haveSave");    // 首先擷取cookie
        console.log(isHasCookei);                   // 成功則列印yes
        if (!(isHasCookei == "yes")) {
            setCookie("haveSave","yes","5000s");    // 如果加載完成就設定一個Cookie,執行一次該步驟
            return false
            },50);
        } else {                                    // Cookie==yes時候執行我們要的
                                                    
        }

        function setCookie(name,value,time) {       // 設定一個cookie
            var strsec = getsec(time);
            var exp = new Date();
            exp.setTime(exp.getTime() + strsec*1);
            document.cookie = name + "="+ value + ";expires=" + exp.toGMTString();
        }
        function getsec(str) {
            var str1=str.substring(1,str.length)*1;
            var str2=str.substring(0,1);
            if (str2=="s") {
                return str1*1000;
            } else if (str2=="h") {
                return str1*60*60*1000;
            } else if (str2=="d") {
                return str1*24*60*60*1000;
            }
        }

       
        function getCookie(name) {                  //擷取一個cookie
            var strCookie = document.cookie;
            var arr = strCookie.split(';');
            for (var i = 0; i < arr.length; i++) {
               var t = arr[i].split("=");
                if(t[0] == name) {
                    return t[1];
                }
            };
            return null;
        }

        function delCookie(name) {                   //删除一個cookie
            var exp = new Date();
            exp.setTime(exp.getTime() - 1);
            var cval=getCookie(name);
            if(cval!=null)
            document.cookie= name + "="+cval+";expires="+exp.toUTCString();
        }
    })
           

JQ方式:

http://blog.csdn.net/qq_35515563/article/details/76513727

繼續閱讀