请大家帮忙看一下下面根据javascript权威指南实现的cookie存储api哪些地方可以进行优化。
非常感谢大家的帮忙,请多多指出,谢谢。<!doctype html>
<!-- Saved from html5snippet.net -->
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8'/>
<style type='text/css'></style>
<script type='text/javascript'>
(function (window) {
var iCookie = function (maxage, path) {
return iCookie.methods._init(maxage, path);
};
iCookie.methods = iCookie.prototype = {
_init: function (maxage, path) {
this.maxage = maxage;
this.path = path;
this._cookie = (function () {
var cookie = {},
all = document.cookie;
if (!all) {
return cookie;
}
var list = all.split("; ");
for (var i = 0; i < list.length; i++) {
var c = list[i];
var p = c.indexOf("=");
var name = c.substring(0, p);
var value = c.substring(p + 1);
cookie[name] = value;
}
return cookie;
} ());
this.keys = [];
for (var key in this._cookie) {
this.keys.push(key);
}
this.length = this.keys.length;
var that = this;
return {
getItem: function() {
return this.getItem.apply(that,arguments);
},
setItem: function() {
return this.setItem.apply(that,arguments);
},
clear : function() {
return this.clear.apply(that,arguments);
},
removeItem : function() {
return this.removeItem.apply(that,arguments);
}
};
},
key: function (n) {
if (n < 0 || n >= this.keys.length) {
return null;
}
return this.keys[n];
},
getItem: function (key) {
return this._cookie[key] || null;
}, setItem: function (key, value) {
if (!(key in this._cookie)) {
this.keys.push(key);
this.length++;
}
this._cookie[key] = value;
var cookie = key + "=" + encodeURIComponent(value);
if (this.maxage) {
cookie += "; max-age=" + this.maxage;
}
if (this.path) {
cookie += "; path=" + this.path;
}
document.cookie = cookie; }, removeItem: function (key) {
if (!(key in this._cookie)) {
return;
}
delete this._cookie[key];
for (var i = 0; i < this.keys.length; i++) {
if (this.keys[i] === key) {
this.keys.splice(i, 1);
break;
}
}
this.length--;
document.cookie = key + "=; max-age=0";
}, clear: function () {
for (var i = 0; i < this.keys.length; i++) {
document.cookie = this.keys[i] + "=; max-age=0";
}
this._cookie = {};
this.keys = [];
this.length = 0;
}
};
window.iCookie = iCookie;
} (window));window.onload = function () { var setCookie = document.getElementById("setCookie");
setCookie.addEventListener("click", function () {
var myName = document.getElementById("myName");
var myAge = document.getElementById("myAge");
iCookie().setItem(myName.value, myAge.value);
myName.value = "";
myAge.value = "";
}); var getCookie = document.getElementById("getCookie"); getCookie.addEventListener("click", function () {
var myName = document.getElementById("myName");
var myAge = document.getElementById("myAge");
var age = iCookie().getItem(myName.value);
myAge.value = age;
});
var clearCookie = document.getElementById("clearCookie");
clearCookie.addEventListener("click", function () {
iCookie().clear();
alert("cleared.");
});
var removeCookie = document.getElementById("removeCookie");
var myName = document.getElementById("myName");
removeCookie.addEventListener("click", function () {
iCookie().removeItem(myName.value);
alert(myName.value + " is removed.");
});
};
</script>
</head>
<body><input type="text" id="myName" />
<input type="text" id="myAge" />
<input type="button" id="setCookie" value="SetCookie" />
<input type="button" id="getCookie" value="GetCookie" />
<input type="button" id="clearCookie" value="clearCookie" />
<input type="button" id="removeCookie" value="removeCookie" />
</body>
</html>
非常感谢大家的帮忙,请多多指出,谢谢。<!doctype html>
<!-- Saved from html5snippet.net -->
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8'/>
<style type='text/css'></style>
<script type='text/javascript'>
(function (window) {
var iCookie = function (maxage, path) {
return iCookie.methods._init(maxage, path);
};
iCookie.methods = iCookie.prototype = {
_init: function (maxage, path) {
this.maxage = maxage;
this.path = path;
this._cookie = (function () {
var cookie = {},
all = document.cookie;
if (!all) {
return cookie;
}
var list = all.split("; ");
for (var i = 0; i < list.length; i++) {
var c = list[i];
var p = c.indexOf("=");
var name = c.substring(0, p);
var value = c.substring(p + 1);
cookie[name] = value;
}
return cookie;
} ());
this.keys = [];
for (var key in this._cookie) {
this.keys.push(key);
}
this.length = this.keys.length;
var that = this;
return {
getItem: function() {
return this.getItem.apply(that,arguments);
},
setItem: function() {
return this.setItem.apply(that,arguments);
},
clear : function() {
return this.clear.apply(that,arguments);
},
removeItem : function() {
return this.removeItem.apply(that,arguments);
}
};
},
key: function (n) {
if (n < 0 || n >= this.keys.length) {
return null;
}
return this.keys[n];
},
getItem: function (key) {
return this._cookie[key] || null;
}, setItem: function (key, value) {
if (!(key in this._cookie)) {
this.keys.push(key);
this.length++;
}
this._cookie[key] = value;
var cookie = key + "=" + encodeURIComponent(value);
if (this.maxage) {
cookie += "; max-age=" + this.maxage;
}
if (this.path) {
cookie += "; path=" + this.path;
}
document.cookie = cookie; }, removeItem: function (key) {
if (!(key in this._cookie)) {
return;
}
delete this._cookie[key];
for (var i = 0; i < this.keys.length; i++) {
if (this.keys[i] === key) {
this.keys.splice(i, 1);
break;
}
}
this.length--;
document.cookie = key + "=; max-age=0";
}, clear: function () {
for (var i = 0; i < this.keys.length; i++) {
document.cookie = this.keys[i] + "=; max-age=0";
}
this._cookie = {};
this.keys = [];
this.length = 0;
}
};
window.iCookie = iCookie;
} (window));window.onload = function () { var setCookie = document.getElementById("setCookie");
setCookie.addEventListener("click", function () {
var myName = document.getElementById("myName");
var myAge = document.getElementById("myAge");
iCookie().setItem(myName.value, myAge.value);
myName.value = "";
myAge.value = "";
}); var getCookie = document.getElementById("getCookie"); getCookie.addEventListener("click", function () {
var myName = document.getElementById("myName");
var myAge = document.getElementById("myAge");
var age = iCookie().getItem(myName.value);
myAge.value = age;
});
var clearCookie = document.getElementById("clearCookie");
clearCookie.addEventListener("click", function () {
iCookie().clear();
alert("cleared.");
});
var removeCookie = document.getElementById("removeCookie");
var myName = document.getElementById("myName");
removeCookie.addEventListener("click", function () {
iCookie().removeItem(myName.value);
alert(myName.value + " is removed.");
});
};
</script>
</head>
<body><input type="text" id="myName" />
<input type="text" id="myAge" />
<input type="button" id="setCookie" value="SetCookie" />
<input type="button" id="getCookie" value="GetCookie" />
<input type="button" id="clearCookie" value="clearCookie" />
<input type="button" id="removeCookie" value="removeCookie" />
</body>
</html>
优化建议:
document应该作为变量定义出来,提高效率。var document=window.document;