编程 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 相关文章推荐

Aptana调试javascript图解教程

Nov 30 Javascript

javascript获取xml节点的最大值(实现代码)

Dec 11 Javascript

JavaScript Math 对象常用方法总结

Apr 28 Javascript

JavaScript中如何使用cookie实现记住密码功能及cookie相关函数介绍

Nov 10 Javascript

浅析js的模块化编写 require.js

Dec 07 Javascript

Angular.js 4.x中表单Template-Driven Forms详解

Apr 25 Javascript

关于vue-router路径计算问题

May 10 Javascript

Node.js+Express+MySql实现用户登录注册功能

Jul 10 Javascript

vue中v-cloak解决刷新或者加载出现闪烁问题（显示变量）

Apr 20 Javascript

vue中axios的二次封装实例讲解

Oct 14 Javascript

Node.js API详解之 console模块用法详解

May 12 Javascript

js实现3D旋转相册

Aug 02 Javascript

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

PHP Header用于页面跳转要注意的几个问题总结

2008/10/03 PHP

php引用传值实例详解学习

2013/11/06 PHP

php通过修改header强制图片下载的方法

2015/03/24 PHP

php导出中文内容excel文件类实例

2015/07/06 PHP

使用PHP访问RabbitMQ消息队列的方法示例

2018/06/06 PHP

如何在PHP中使用AES加密算法加密数据

2020/06/24 PHP

PHP 使用位运算实现四则运算的代码

2021/03/09 PHP

[JS源码]超长文章自动分页（客户端版）

2007/01/09 Javascript

Javascript attachEvent传递参数的办法

2009/12/14 Javascript

Jquery + Ajax调用webService实例代码(asp.net)

2010/08/27 Javascript

初窥JQuery-Jquery简介入门了解篇

2010/11/25 Javascript

javascript 正则表达式相关应介绍

2012/11/27 Javascript

用console.table()调试javascript

2014/09/04 Javascript

轻松学习jQuery插件EasyUI EasyUI表单验证

2015/12/01 Javascript

javascript 数组的正态分布排序的问题

2016/07/31 Javascript

JavaScript仿聊天室聊天记录

2016/12/27 Javascript

详解node.js平台下Express的session与cookie模块包的配置

2017/04/26 Javascript

浅谈Postman解决token传参的问题

2018/03/31 Javascript

微信小程序和百度的语音识别接口详解

2019/05/06 Javascript

微信小程序返回上一页传参并刷新过程解析

2019/12/13 Javascript

快速解决Vue、element-ui的resetFields()方法重置表单无效的问题

2020/08/12 Javascript

vue项目里面引用svg文件并给svg里面的元素赋值

2020/08/17 Javascript

让你30分钟快速掌握vue3教程

2020/10/26 Javascript

解决antd的Form组件setFieldsValue的警告问题

2020/10/29 Javascript

[45:59]完美世界DOTA2联赛PWL S2 FTD vs GXR 第二场 11.22

2020/11/24 DOTA

对python xlrd读取datetime类型数据的方法详解

2018/12/26 Python

Python hexstring-list-str之间的转换方法

2019/06/12 Python

python进程间通信Queue工作过程详解

2019/11/01 Python

英国最受欢迎的价格比较网站之一：MoneySuperMarket

2018/12/19 全球购物

世界顶级户外运动品牌折扣网站：LeftLane Sports

2019/06/12 全球购物

巴西儿童时尚购物网站：Dinda

2019/08/14 全球购物

Currentbody澳大利亚：美容仪专家

2019/11/11 全球购物

好的演讲稿开场白

2013/12/30 职场文书

庆祝教师节活动方案

2014/01/31 职场文书

超市国庆节促销方案

2014/02/20 职场文书

一文了解Java动态代理的原理及实现

2022/07/07 Java/Android