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

2019-12-24,,

一、局部改变样式

有三种方法:直接改变样式、改变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>

您可能感兴趣的文章:

  • js中用cssText设置css样式的简单方法
  • js获取页面引用的css样式表中的属性值方法(推荐)
  • JavaScript动态添加css样式和script标签
  • javascript 动态修改css样式方法汇总(四种方法)
  • JS判断移动端访问设备并加载对应CSS样式
  • 纯css+js写的一个简单的tab标签页带样式
  • jsp页面中插入css样式的三种方法总结
  • 用JS动态设置CSS样式常见方法小结(推荐)

《Javascript改变CSS样式(局部和全局).doc》

下载本文的Word格式文档,以方便收藏与打印。