编程 Javascript

Javascript改变CSS样式(局部和全局)

Posted in Javascript onDecember 18, 2013

一、局部改变样式

有三种方法：直接改变样式、改变className和改变cssText

改变className： document.getElementById('obj').className="…"

改变cssText：document.getElementById('obj').style.cssText="width:20px; border:solid 1px #f00;";

改变直接样式： document.getElementById('obj').style.backgroundColor="#003366″

二、全局改变样式

通过改变外链样式的的href的值实现网页样式的实时切换，也就是"改变模板风格"。

首先需要赋予需要改变的目标一个id，如

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

调用时很简单，如

<span onclick="javascript:document.getElementById('css').href='ie.css'">点我改变样式</span>

Javascript改变CSS样式(局部和全局)

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

Div Select挡住的解决办法

Aug 07 Javascript

jQuery 选择器、DOM操作、事件、动画

Nov 25 Javascript

解析ScrollPic在ie8下只滚动一遍,然后变为空白 ie6,ie7,chrome,firefox正常

Jun 26 Javascript

怎么判断js脚本加载完成

Feb 28 Javascript

javascript实现日期格式转换

Dec 16 Javascript

JS中对Cookie的操作详解

Aug 05 Javascript

Bootstrap框架结合jQuery仿百度换肤功能实例解析

Sep 17 Javascript

angularjs实现的前端分页控件示例

Feb 10 Javascript

Node.js使用Express.Router的方法

Nov 14 Javascript

JavaScript实现正则去除a标签并保留内容的方法【测试可用】

Jul 18 Javascript

Jquery遍历筛选数组的几种方法和遍历解析json对象,Map()方法详解以及数组中查询某值是否存在

Jan 18 jQuery

浅谈JS和jQuery的区别

Mar 27 jQuery

jquery 提示信息显示后自动消失的具体实现

Dec 18 #Javascript

javascript中数组的concat()方法使用介绍

Dec 18 #Javascript

javascript中数组的sort()方法的使用介绍

Dec 18 #Javascript

javascript中数组的冒泡排序使用示例

Dec 18 #Javascript

javascript中数组中求最大值示例代码

Dec 18 #Javascript

JS动态调用方法名示例介绍

Dec 18 #Javascript

javascript页面动态显示时间变化示例代码

Dec 18 #Javascript

You might like

使用TinyButStrong模板引擎来做WEB开发

2007/03/16 PHP

简单实用的网站PHP缓存类实例

2014/07/18 PHP

PHP实现数组转JSon和JSon转数组的方法示例

2018/06/14 PHP

PHP的PDO大对象(LOBs)

2019/01/27 PHP

Laravel 错误提示本地化的实现

2019/10/22 PHP

js左侧多级菜单动态的解决方案

2010/02/01 Javascript

jQuery jqgrid 对含特殊字符json 数据的 Java 处理方法

2011/01/01 Javascript

javascript window.confirm确认取消对话框实现代码小结

2012/10/21 Javascript

jQuery 过滤方法filter()选择具有特殊属性的元素

2014/06/15 Javascript

jQuery+HTML5实现图片上传前预览效果

2015/08/20 Javascript

原生JS实现图片网格式渐显、渐隐效果

2017/06/05 Javascript

详解angular 中的自定义指令之详解API

2017/06/20 Javascript

JavaScript之RegExp_动力节点Java学院整理

2017/06/29 Javascript

JS实现微信摇一摇原理解析

2017/07/22 Javascript

js下拉菜单生成器dropMenu使用方法详解

2017/08/01 Javascript

js实现鼠标跟随运动效果

2020/08/02 Javascript

three.js中文文档学习之如何本地运行详解

2017/11/20 Javascript

Layui数据表格之获取表格中所有的数据方法

2018/08/20 Javascript

详解vue 路由跳转四种方式 (带参数)

2019/04/28 Javascript

nodejs实现用户登录路由功能

2019/05/22 NodeJs

浅谈Python中用datetime包进行对时间的一些操作

2016/06/23 Python

Python 安装setuptools和pip工具操作方法(必看)

2017/05/22 Python

python音频处理用到的操作的示例代码

2017/10/27 Python

Mac安装python3的方法步骤

2019/08/09 Python

使用python实现kNN分类算法

2019/10/16 Python

Python的几种主动结束程序方式

2019/11/22 Python

pytorch实现onehot编码转为普通label标签

2020/01/02 Python

如何基于python对接钉钉并获取access_token

2020/04/21 Python

CSS3感应鼠标的背景闪烁和图片缩放动画效果

2014/05/14 HTML / CSS

阿迪达斯墨西哥官方网站：adidas墨西哥

2017/11/03 全球购物

超市营业员岗位职责

2013/12/20 职场文书

浙大毕业生自荐信

2014/01/26 职场文书

2014年服装销售工作总结

2014/11/27 职场文书

爱国主义影片观后感

2015/06/18 职场文书

售房协议书范本

2015/08/11 职场文书

使用Python脚本对GiteePages进行一键部署的使用说明

2021/05/27 Python