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

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

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Document</title>

     <link id="l1" rel="stylesheet" type="text/css" href="css1.css" />

     <script type="text/javascript">

     function skin1(){

         var a=document.getElementById('l1');

         a.href='css1.css';

     }

     function skin2(){

         var a=document.getElementById('l1');

         a.href='css2.css';

     }

     </script>

 </head>

 <body>

     <input type="button" value="orange" onclick="skin1()" />

     <input type="button" value="yellow" onclick="skin2()" />

 </body>

 </html>

第一套css

 body{

     background-color: orange;

 }

 input{

     width: 50px;

     height: 30px;

     background-color: orange;

 }

第二套css

 body{

     background-color: yellow;

 }

 input{

     width: 50px;

     height: 30px;

     background-color: yellow;

 }

JS切换的更多相关文章

  1. 一个简单且丑陋的js切换背景图片基础示例

    不多说,直接上代码,非常基础的一个原生js切换元素背景图片范例 <html> <head> <meta http-equiv="Content-Type&quo ...

  2. Tab标签js切换高效率写法

    原来的传统写法: function tabit(id,cid) { for(var i=0; i<10; i++){ gi(["tab"+i]).className = &q ...

  3. easyui字典js 切换 jsp页面显示的内容

    在列表中直接切换 formatter: function (value) {var name;if(value==0){name='待审批'}else if(value==1){name='通过'}e ...

  4. 记录一个js切换随机背景颜色的代码

    <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8& ...

  5. js 切换图片

    <html><head lang="en"> <meta charset="UTF-8"> <title>< ...

  6. js 切换全屏

    公司有一个需求就是点击某一个按钮实现全屏切换功能,然后呢我就在网上扒了段代码.封装了一下.使用的小伙伴们可以看看哦! 切换全屏代码 <!DOCTYPE html> <html> ...

  7. 简单js 切换左侧栏目的样式

    这是html代码,里面写了left.html <div id='mydiv'> <a class='qwe'>1</a> <a class='qwe'> ...

  8. js 切换隐藏

    先试试 显示\隐藏切换 脚本之家欢迎您 切换隐藏 <style type="text/css"> #thediv { width:200px; height:100px ...

  9. node.js切换多个版本

    开言 试用场景就是我们开发项目的时候,有可能一个项目需要v10版本,另一个项目需要v8版本,遇到这种问题,我们不能卸载再重新安装对应的版本去开发,遇到这样的问题的时候,那我们就可以去用另一种方式去切换 ...

  10. js切换全屏

    直接撸代码 //<a id="fullscreen">切换按钮</a> $('#fullscreen').bind('click',function () ...

随机推荐

  1. Spring Cloud动态刷新配置信息

    有时候在配置中心有些参数是需要修改的,这时候如何不重启而达到实时生效的效果呢? 添加依赖 <dependencies> ... <dependency> <groupId ...

  2. redis 入门之列表

    lpush 将一个或多个值 value 插入到列表 key 的表头如果有多个 value 值,那么各个 value 值按从左到右的顺序依次插入到表头: 比如说,对空列表 mylist 执行命令 LPU ...

  3. 【记录】Nginx错误could not build the server_names_hash you should increase server_names_hash_bucket_size: 32

    今天遇到这个错误,现记录下解决方案: 在nginx的配置文件的http段中增加如下配置: server_names_hash_bucket_size 64; 下面是nginx官方文档解释: 如果定义了 ...

  4. 第二章 部署Kubernetes集群准备环境

    一.centos7开机自动联网设置 1.使用root用户登录进入Linux,打开进去终端 2.在终端中输入:cd  /etc/sysconfig/network-scripts 3.ll命令找到目录下 ...

  5. Linux账号管理与ALC权限设定（一）

    UID  与   GID UID用户的编号  GID 用户群组的编号 账号登录时,有一个对应的文本来记录某个账户的UID与GID.然后获得这个UID去对应的密码文本中,取得密码进行比对,然后登陆. 保 ...

  6. CreateFile的内部实现

    今天想看看CreateFile的内部实现,不过网上没有想要的资料,都只是对参数分析了一下.找了找WRK源码,找到CreateFile的源码自己来分析一下. HANDLE WINAPI CreateFi ...

  7. asp.net网站Application_Start疑是不执行的现象

    今天遇见了一个很诡异的事情,发布了新代码后,发现在Application_Start中读取的一些配置参数变为空了,最开始我以为是什么特殊的原因程序没有执行Application_Start,导致它们的 ...

  8. mysql查询相关

    查询事务 SELECT * FROM information_schema.INNODB_TRX\G; 查询正在锁的事务 SELECT * FROM INFORMATION_SCHEMA.INNODB ...

  9. Hive速览

    一.概述 Hive由Facebook开源,是一个构建在Hadoop之上的数据仓库工具 将结构化的数据映射成表 支持类SQL查询,Hive中称为HQL 1.读模式 2.Hive架构 3.使用Hive的原 ...

  10. Vue学习笔记【24】——Vue组件（组件切换）

    使用flag标识符结合v-if和v-else切换组件 页面结构:(缺点:只适用于两个组件间切换,不适合多个)  <div id="app">    <input ...