<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link href="black.css" rel="stylesheet" type="text/css" title="black" />
<link href="red.css" rel="alternate stylesheet" type="text/css" title="red" />
<link href="yellow.css" rel="alternate stylesheet" type="text/css" title="yellow" />
<link href="blue.css" rel="alternate stylesheet" type="text/css" title="blue" />
<link href="main.css" rel="stylesheet" type="text/css" />
</head>
<body>
<ul id="styleSheetTarget">
<li><a href="#" title="black">black</a></li>
<li><a href="#" title="red">red</a></li>
<li><a href="#" title="yellow">yellow</a></li>
<li><a href="#" title="blue">blue</a></li>
</ul>
<script type="text/javascript">
window.onload=function(){
changeStyle("styleSheetTarget");
}
function changeStyle(targetLinks){
//var theCookie=document.cookie;
var targetLinks=document.getElementById(targetLinks).getElementsByTagName('a');
var styles=document.getElementsByTagName('link');
if(document.cookie.indexOf('styleCookie')>-1){
//alert('yes');
readCookie();
}
for(var i=0; i<targetLinks.length;i++){
targetLinks.onclick=function(){
for(var j=0; j<styles.length;j++){
if(styles[j].getAttribute('title')){
styles[j].disabled=true;
}
if(styles[j].getAttribute('title')==this.getAttribute('title')&&styles[j].disabled==true){
styles[j].disabled=false;
setCookie(this.getAttribute('title'));
//alert(this.getAttribute('title'));
}
}
return false;
}
}
function setCookie(thisTitle){
var timer=new Date();
timer.setTime(timer.getTime()+1000*365*60*60*24);
document.cookie='styleCookie='+thisTitle+';expires='+timer.toGMTString();
//alert(document.cookie);
}
function readCookie(){
var thisTitle=document.cookie.split('styleCookie=')[1].split(';');
//alert(thisTitle);
for(var j=0; j<styles.length;j++){
if(styles[j].getAttribute('title')){
styles[j].disabled=true;
}
if(styles[j].getAttribute('title')==thisTitle){
styles[j].disabled=false;
}
}
}
}
</script>
</body>
</html>
===========================================================
