一、使用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代码';

总结

知道如何动态修改页面上所应用的样式,对创建时髦而又富于交互的 Web 页面来说是极其有用的——本文中所阐述的知识构成了诸如 JavaScript 动画之类更高级的技术的基础。需要注意的是,你应当负责任地使用动态样式修改,而且不要过度滥用。如前面所述,样式修改还能提高Web效率——内容的显示和隐藏可以有助于避免在客户端和服务器之间不必要的数据交互。

标签:
Javascript,操作CSS

免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
桃源资源网 Design By www.nqtax.com

评论“详解Javascript动态操作CSS”

暂无“详解Javascript动态操作CSS”评论...

稳了!魔兽国服回归的3条重磅消息!官宣时间再确认!

昨天有一位朋友在大神群里分享,自己亚服账号被封号之后居然弹出了国服的封号信息对话框。

这里面让他访问的是一个国服的战网网址,com.cn和后面的zh都非常明白地表明这就是国服战网。

而他在复制这个网址并且进行登录之后,确实是网易的网址,也就是我们熟悉的停服之后国服发布的暴雪游戏产品运营到期开放退款的说明。这是一件比较奇怪的事情,因为以前都没有出现这样的情况,现在突然提示跳转到国服战网的网址,是不是说明了简体中文客户端已经开始进行更新了呢?