javascript css 实时切换

javascript css 实时切换

<link rel="stylesheet" type="text/css" href="./css/color-theme-1.css" title="skin1">
<link rel="stylesheet" type="text/css" href="./css/color-theme-2.css" title="skin2">


<script type="text/javascript">

 function setStyle(title) {

   var i, links;  
   links = document.getElementsByTagName("link");    //用DOM方法获得所有的link元素
  
   for(i=0; links[i]; i++) {
          //判断此link元素的rel属性中是否有style关键字
         //即此link元素是否为样式表link
         //同时判断此link元素是否含有title属性
  if(links[i].getAttribute("rel").indexOf("style") != -1 && links[i].getAttribute("title")) {
     links[i].disabled = true;     //把它设为disabled

         //再判断它的title中是否有我们指定的关键字
    if(links[i].getAttribute("title").indexOf(title) != -1)
        //如果有则将其激活
      links[i].disabled = false;
  }
   }
 }
</script>   


<input type="button" value="skin2" onclick="setStyle('skin1');" />
<input type="button" value="skin1" onclick="setStyle('skin2');" />

有css switch.rar 代码可以直接测试  http://www.blogjava.net/Files/anderson/css%20switch.rar

你可能感兴趣的:(javascript css 实时切换)