JS切换

时间:2019-09-06
本文章向大家介绍JS切换,主要包括JS切换使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。

这个效果就跟换肤效果差不多

需要准备两套或两套以上的css

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6     <link id="l1" rel="stylesheet" type="text/css" href="css1.css" />
 7     <script type="text/javascript">
 8     function skin1(){
 9         var a=document.getElementById('l1');
10         a.href='css1.css';
11     }
12     function skin2(){
13         var a=document.getElementById('l1');
14         a.href='css2.css';
15     }
16     </script>
17 </head>
18 <body>
19     <input type="button" value="orange" onclick="skin1()" />
20     <input type="button" value="yellow" onclick="skin2()" />
21 </body>
22 </html>

第一套css

1 body{
2     background-color: orange;
3 }
4 input{
5     width: 50px;
6     height: 30px;
7     background-color: orange;
8 }

第二套css

1 body{
2     background-color: yellow;
3 }
4 input{
5     width: 50px;
6     height: 30px;
7     background-color: yellow;
8 }

原文地址:https://www.cnblogs.com/jiushui/p/11474944.html