設置cookie的部分沒有調通,還需調整
先貼代碼如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>換膚</title>
<link type="text/css" rel="stylesheet" href="style1.css" title="白色風格"/>
<link type="text/css" rel="stylesheet" href="style2.css" title="灰色風格"/>
<link type="text/css" rel="stylesheet" href="style3.css" title="黃色風格"/>
<script type = "text/javascript">
//添加事件處理函數
function addEventListener(ele,type,func){
if(ele.addEventListener){
//DOM兼容瀏覽器
ele.addEventListener(type,func,false);
}else{
//IE
ele.attachEvent("on"+type,func);
}
}
function $(id){
return document.getElementById(id);
}
function setActiveStyleSheet(title){
//所有的link元素
var links = document.getElementsByTagName("link");
//遍歷所有的<link>元素
for(var i= 0; i<links.length;i++){
//當前的link元素
var link=links[i];
//如果是樣式錶鏈接
if(link.rel =="stylesheet" && link.title){
//首先禁用所有的樣式表
link.disabled = true;
//如果找到title屬性符合的樣式表,則將其激活
if(link.title == title)
link.disabled = false;
}
}
//將title屬性保存在Cookie中
SetCookie("activeStyleSheet",title,7);
}
function SetCookie(cookieName,cookieValue,nDays){
//當前日期
var today = new Date();
//Cookie過期事件
var expire = new Date();
//如果未設置nDays參數或者nDays爲0,取默認值1
if(nDays == null||nDays==0)
nDays=1;
//計算Cookie過期時間
expire.setTime(today.getTime() + 3600000*24*nDays);
//設置Cookie值
// document.cookie =cookieName+"="+escape(cookieValue)+"; expires="+expire.toGMTString();
alert(document.cookie);
document.cookie= "name1=value1";
alert(document.cookie);
}
function ReadCookie(cookieName){
//Cookie字符串
var theCookie =""+document.cookie;
//找到cookieName的位置
var ind =theCookie.indexOf(cookieName);
//如果未找到cookieName,返回空字符串
if(ind==-1||cookieName =="")return "";
//確定分號的位置
var ind1 = theCookie.indexOf(';',ind);
if(ind1 == -1) ind1 =theCookie.length;
//讀取Cookie值
return unescape(theCookie.substring(ind+cookieName.length+1,ind1));
}
function setDefaultStyleSheet(){
//默認選中第一個樣式表
if($("styleSel").options.lenght>0) {
setActiveStyleSheet($("styleSel").options[0].value);
}
}
function init(){
// alert("ss");
//從Cookies中讀取樣式信息
var savedStyleSheet = ReadCookie ("activeStyleSheet");
var links =document.getElementsByTagName("link");
//遍歷所有的<link>元素
for(var i=0; i<links.length; i++){
var link =links[i];
//如果是樣式錶鏈接
if(link.rel =="stylesheet"){
//創建新的option元素
var option =document.createElement("option");
//設置<option>元素的value屬性
option.value= link.title;
//設置<option>元素的顯示文本內容
option.innerHTML =link.title;
//將<option>元素添加到<select>元素中
$("styleSel").appendChild(option);
}
}
//激活選中的樣式表
if(savedStyleSheet) {
setActiveStyleSheet(savedStyleSheet);
}else{
//設置默認樣式表
setDefaultStyleSheet();
}
//添加<select>元素的change事件處理函數
addEventListener($("styleSel"),"change",function(evt){
//激活選中的樣式表
setActiveStyleSheet($("styleSel").value);
//切換焦點
document.body.focus();
});
}
</script>
</head>
<body οnlοad="init()">
<select id="styleSel">
</select>
<div>
<p>
..wwwwwwww
</p>
</div>
</body>
</html>