在浏览网页的时候,我们经常可以看到部分页面上具有换肤功能,点击改变皮肤且但我们下次浏览的时候,还会是我们选择的皮肤。作为菜鸟来说,这是一种赤裸裸的诱惑……今天查了相关资料,很粗糙的写了一个利用coolkie的换肤效果。求大神勿喷,也请多多指点。下面是菜鸟代码……
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>show0731</title>
<meta name="author" content="Administrator" />
<!-- Date: 2014-07-31 -->
<style type="text/css">
body {padding:0;margin:0;}
input{width:50px;height:50px;border:none;}
</style>
<script type="text/javascript">
window.οnlοad=function(){
var bg=getCookie('bg');//传入的值为cookie的name、
if(bg!=null){
document.body.style.background="url(images/"+bg+".jpg)";
}
else{
document.body.style.background="url(images/0.jpg)";
}
};
function change(name,value){//点击改变背景,且重新写入cookie
document.body.style.background="url(images/"+value+".jpg)";
setCookie(name,value);
}
function setCookie(name,value){//建立cookie记录
var day=30;//有效时间
var exp=new Date();//建立Date对象
exp.setTime(exp.getTime()+day*24*60*1000);//setTime(),以毫秒设置Date对象。etTime()可返回距 1970 年 1 月 1 日之间的毫秒数。
//写入cookie,escape() 函数可对字符串进行编码,这样就可以在所有的计算机上读取该字符串
document.cookie=name+"="+escape(value)+";expires="+exp.toGMTString();
}
function getCookie(name)//获取cookie
{
var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");//正则表达式
if(arr=document.cookie.match(reg)){//match() 方法可在字符串内检索指定的值,或找到一个或多个正则表达式的匹配。
return (arr[2]);
}
else{
return null;
}
}
</script>
</head>
<body>
<input type="button" style="background:#CCCCFF;" οnclick="change('bg',0)"/>
<input type="button" style="background:#7807f8;" οnclick="change('bg',1)"/>
<input type="button" style="background:#1616e2;" οnclick="change('bg',2)"/>
<input type="button" style="background:#0ad4ba;" οnclick="change('bg',3)"/>
<input type="button" style="background:#0ad41d;" οnclick="change('bg',4)"/>
</body>
</html>
源文件免费下载地址:
http://download.csdn.net/detail/u014703834/7699979