平时大家一定遇到过想在HTM页面来显示和操作Cookies的，以下是代码片段，大家可以批批，个人感觉效果不错，所以记录下。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[url]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd[/url]">
<html xmlns="[url]http://www.w3.org/1999/xhtml[/url]">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Javascript Cookies</title>
<script type="text/javascript">
// 写 cookie
function setCookie(sName, sValue, iTime){
var date = new Date();
date.setTime(date.getTime()+iTime*1000);
document.cookie = escape(sName) + "=" + escape(sValue) + "; expires=" + date.toGMTString();
}
// 读 cookie
function getCookie(sName){
var aCookie = document.cookie.split("; ");
for (var i=0; i < aCookie.length; i++){
var aCrumb = aCookie[i].split("=");
if (escape(sName) == aCrumb[0])
return unescape(aCrumb[1]);
}
return null;
}
// 删 cookie
function delCookie(sName){
var date = new Date();
document.cookie = sName + "= ; expires=" + date.toGMTString();
}
// 测试函数
function trace(){
document.getElementById("trace").innerHTML = document.cookie;
}
// 参考: DHTML 手册
</script>
</head>
<body>
<h2>Javascript Cookies</h2>
<hr />
<form id="frmTest" name="frmTest" method="post" action="javascript:return false;">
<p><strong>Cookie :</strong> sName = sValue; expires = iTime.getGMTString() </p>
<p>sName :
<input name="sName" type="text" id="sName" />
<br />
sValue:
<input name="sValue" type="text" id="sValue" />
<br />
iTime :
<input name="iTime" type="text" id="iTime" />
</p>
<p>
<input name="btnSetCookie" type="button" id="btnSetCookie" value="Set Cookie" onclick="setCookie(document.frmTest.sName.value, document.frmTest.sValue.value, document.frmTest.iTime.value);trace();" />
<input name="btnGetCookie" type="button" id="btnGetCookie" value="Get Cookie" onclick="alert(document.frmTest.sName.value + ' = ' + getCookie(document.frmTest.sName.value));" />
<input name="btnDelCookie" type="button" id="btnDelCookie" value="Del Cookie" onclick="delCookie(document.frmTest.sName.value);trace();" />
</p>
</form>
<div id="trace"></div>
</body>
</html>
