Javascript改变CSS样式(局部和全局)_javascript技巧
程序员文章站
2022-05-07 18:12:55
...
一、局部改变样式
有三种方法:直接改变样式、改变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,如
调用时很简单,如
点我改变样式
有三种方法:直接改变样式、改变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,如
复制代码 代码如下:
调用时很简单,如
复制代码 代码如下:
点我改变样式
推荐阅读
-
JavaScript的局部变量和全局变量小知识
-
工作中遇到的HTML和CSS布局和JavaScript技巧记录分享
-
如何用JavaScript去操作HTML元素和CSS样式
-
javascript当中局部变量和全局变量
-
JS 控制CSS样式表_javascript技巧
-
JS操作CSS随机改变网页背景实现思路_javascript技巧
-
使用js操作css实现js改变背景图片示例_javascript技巧
-
javascript 改变网页加载的CSS_javascript技巧
-
js控制不同的时间段显示不同的css样式的实例代码_javascript技巧
-
web css实现整站样式互相切换_javascript技巧