js代码如何设置缓存数据cache.js

js代码如何设置缓存数据cache.js

设置缓存数据js的源代码cache.js，可以在浏览器中使用js缓存数据，需要一点小伙伴可以看一下。

cache.js源代码如下：

$.extend($, {
    Cache : {
        userData: false,
        supportLocalStorage: typeof localStorage == 'object' ? true : false,
        name: location.hostname,
 
        init: function () {
            if ( $.Cache.supportLocalStorage )
                return false;
            if ( !$.Cache.userData ) {
                try {
                    $.Cache.userData = document.createElement('INPUT');
                    $.Cache.userData.type = "hidden";
                    $.Cache.userData.style.display = "none";
                    $.Cache.userData.addBehavior("#default#userData");
                    document.body.appendChild($.Cache.userData);
                    var expires = new Date();
                    expires.setDate(expires.getDate() + 365);
                    $.Cache.userData.expires = expires.toUTCString();
                } catch (e) {
                    return false;
                }
            }
            return true;
        },
 
        set: function (key, value, expire) {
            if ( typeof value == 'object' ) {
                value = JSON.stringify(value);
            }
            if ( expire == undefined )
                expire = 0;
 
            if ( $.Cache.init() ) {
                $.Cache.userData.load($.Cache.name);
                $.Cache.userData.setAttribute(key, value);
                if ( expire > 0 ) {
                    var timestamp = Date.parse(new Date());
                    var expiration = timestamp + expire;
                    $.Cache.userData.setAttribute(key + "_EXPIRE", expiration);
                }
                $.Cache.userData.save($.Cache.name);
            } else {
                localStorage.setItem(key, value);
                if ( expire > 0 ) {
                    var timestamp = Date.parse(new Date());
                    var expiration = timestamp + expire;
                    localStorage.setItem(key + "_EXPIRE", expiration);
                }
            }
        },
 
        get: function (key) {
            var val;
            var timestamp = Date.parse(new Date());
            if ( $.Cache.init() ) {
                $.Cache.userData.load($.Cache.name);
                val = $.Cache.userData.getAttribute(key);
                var expiration = $.Cache.userData.getAttribute(key + "_EXPIRE");
                if ( expiration != null && expiration != undefined && expiration > 0  ) {
                    if ( expiration < timestamp) {
                        $.Cache.userData.removeAttribute(key);
                        $.Cache.userData.removeAttribute(key + "_EXPIRE");
                        return undefined;
                    }
                }
            } else {
                val = localStorage.getItem(key);
                var expiration = localStorage.getItem(key + "_EXPIRE");
                if ( expiration != null && expiration != undefined && expiration > 0 ) {
                    if ( expiration < timestamp) {
                        localStorage.removeItem(key);
                        localStorage.removeItem(key + "_EXPIRE");
                        return undefined;
                    }
                }
            }
            if ( val == null || val == undefined || val == "" )
                return undefined;
            if ( val.indexOf("{") == 0 || val.indexOf("[") == 0 ) {
                return JSON.parse(val);
            }
            return val;
        },
        del : function(key) {
            if ( $.Cache.init() ) {
                $.Cache.userData.load($.Cache.name);
                $.Cache.userData.removeAttribute(key);
                $.Cache.userData.removeAttribute(key + "_EXPIRE");
            } else {
                localStorage.removeItem(key);
                localStorage.removeItem(key + "_EXPIRE");
            }
        },
    }
});
 
使用方法演示：
 
$(function(){
var cacheCity = $.Cache.get('city');
        var cacheCity_id = $.Cache.get('city_id');
 
        if ( cacheCity ) {
            $("input[name=city]").val(cacheCity);
        }
 
        if(cacheCity_id){
            $("input[name=city_id]").val(cacheCity_id);
        }
}
 
缓存数据可直接赋值给input，使用起来还是非常方便的。