如何通过 JavaScript 在运行时操作 CSS

来源： 如何通过 JavaScript 在运行时操作 CSS

在本教程的 JavaScript 部分中，到目前为止我们已经学过了 JavaScript 的基础用法，研究了如何通过 DOM 来获取元素并如何在获取成功后对其进行操作。
本文我们会讨论如何通过 JavaScript 在运行时操作 CSS，从而动态地更新应用到我们的元素上的式样。本文所用的技术是我们已经看到过的，但在利用 CSS DOM 来进行操作的时候还需要注意几个特殊点。下面的章节将讲述这些内容：

一、使用js操作css属性的写法
1、对于没有中划线的css属性一般直接使用style.属性名即可。
如：obj.style.margin，obj.style.width，obj.style.left，obj.style.position
2、对于含有中划线的css属性，将每个中划线去掉并将每个中划线后的第一个字符换成大写即可。
如：obj.style.marginTop，obj.style.borderLeftWidth，obj.style.zIndex，obj.style.fontFamily等
3、js操作css float属性的特殊写法
因为 float 是javascript的保留字，我们不能直接使用obj.style.float来使用，这样操作是无效的。其正确的使用方法是为：IE:obj.style.styleFloat，其他浏览器Mozilla(gecko)，ff等用 styleFloat:obj.style.cssFloat。

二、使用js获取css属性值
1、获取行内Style：obj.style. 属性名。<div id="css88" class="ss" style="width:200px; height:200px; background:#333333">JS获取CSS属性值</div> 不能访问class。
2、获取Class内及Link外部的Css属性：IE中使用的是obj.currentStyle[“属性名”]方法，而FF是用的是getComputedStyle 方法

三、使用js给css属性赋值
1、赋值class属性
赋值：document.getElementById('ceil').className = "class1";
如它有多个值：document.getElementById('ceil').className = "class1 class2 class3";
2、obj.style.cssText设定一个对象的css样式
document.getElementById('navition').style.cssText = "您的CSS代码';

• js错误拒绝访问
• jsp 错误验证提示
• php json ajax
• 山东 js搅拌机
• js 横向打印
• js选项卡
• aspjsp家校通源代码
• extjs ajax 异步
• js开发手册
• js typeof undefined
• jsp 微信
• 奔驰js350
• js函数执行顺序
• js tree
• jsp网页生成word
• 拍卖系统jsp
• jsp javabean 与jdbc综合程序设计
• js判断中文字符长度
• js110a锁匙 计算器
• gdjs 100l
• 北京jsp网页编程
• js验证文本框特殊字符