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

需要准备两套或两套以上的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. Neo4J(Cypher语句)初识

    欢迎各路大神临幸寒舍 以下节点标签为people,friend,用户自己也可以设置成其他标签,查询时需要用到标签.这个标签可以类比为关系数据库中的表名 创建节点.关系 创建节点(小明):create ...

  2. pytest_参数化之3*3

    import pytesttest_user_data1=[{'user':'linda','password':'888888'}, {'user':'servenruby','password': ...

  3. koa2实现登录注册功能(ejs+mongodb版)

    gtihub仓库地址:(由于国内处于敏感时期,github暂时无法访问) 主要使用的中间件: "ejs": "^2.7.1",(渲染模板) "koa& ...

  4. ionic3.0 中带顶部导航的下拉刷新列表的实现

    1.最终实现效果 2.html代码布局: 3.css样式控制(注:下面这两个css类名需在浏览器解析后才可看到)

  5. Sql批量修改语句

    修改某个数字类型字段 SET @num = 10000000000001; #定义初始化变量参数 UPDATE ckys_me #更新的表 SET openid = (@num := @num+1) ...

  6. Gym 102028J 扫描线/二维差分 + 解方程

    题意:有一个二维平面,以及n个操作,每个操作会选择一个矩形,使得这个二维平面的一部分被覆盖.现在你可以取消其中的2个操作,问最少有多少块地方会被覆盖? 思路:官方题解简洁明了,就不细说了:https: ...

  7. laravel将数组转换成集合

    $myArray = collect($this -> menuPermissionTypes); //$this -> menuPermissionTypes是数组! dd($myArr ...

  8. 修改Centos中的ll命令(以 K 为单位显示文件大小)

    修改CentOS ll命令:以K 为单位显示文件大小 1.编辑 .bashrc 文件:vim /root/.bashrc 2.找到 alias ll 行修改为(如果没有直接添加该行):alias ll ...

  9. ubuntu 下gcc的编译运行

    一些基本的操作 $gcc test.c //将test.c预处理.汇编.编译并链接形成可执行文件test $gcc test.c -o test //-o用来指定输出文件的文件名 $gcc -E te ...

  10. Linux特殊权限设置以及使用

    Linux文件权限特殊权限(s-s-t) 什么是suid权限 SUID是可执行文件的特殊文件权限,使其他用户能够以文件所有者的有效权限运行文件. 代替执行权限的正常x代替用户的s(指示SUID )特权 ...