正文

js控制css样式 js控制css样式隐藏

技术帮
技术帮 V管理员 /50阅读/0评论
1130

JS设置CSS样式

　　　　javascript改变CSS样式分为局部和全局，分别如下：　　一、局部改变样式　　　　有三种方法：直接改变样式、改变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中如何使用全局变量css样式

用js代码改变css样式，包括全局样式与局部样式。

一、局部改变样式

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

1，改变className：

复制代码 代码示例:

document.getElementById('obj').className="…"

js控制css样式 js控制css样式隐藏

2，改变cssText：

复制代码 代码示例:

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

3，改变直接样式：

复制代码 代码示例:

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>