如何javascript获取css中的样式

 时间:2024-10-14 04:38:11

1、首先我们要用一个新的方法currentStyle.这个方法由current和style两个单词组成意思是:目前的样式.也就是加载css文件后取出来的样式.

如何javascript获取css中的样式

2、currentStyle的用法是:元素.currentStyle.属性名下面我们开始获取如图div1的width样式,那我们就需要这样写:var w=document.getElementById('div1').currentStyle.width;alert(w);在IE下调试,看是不是可以得到正确的宽度了

如何javascript获取css中的样式
如何javascript获取css中的样式

3、IE可以了然后我们换个火狐试试,无论我怎么刷新都没有弹出我希望的200px,f12调试一下,原来如此,火狐不支持currentStyle方法.

如何javascript获取css中的样式
如何javascript获取css中的样式

4、火狐和Chrome支持的是另外一个方法:getComputedStyle,大概意思就是获取完成的样式.用法:getComputedStyl髫潋啜缅e(元素,false).属性名同2,我们的代码应该这样写:var w=getComputedStyle(document.getElementById('div1'),false).width;alert(w);现在不报错了,也能正常的获取了

如何javascript获取css中的样式

5、可是我们用ie试试,肯定没反应了.因为ie又不支持getComputedStyle了.....是不是很蛋疼

6、所以现在我们要写一个函数叫做getClass;内容如下://兼容获取非行间样式 function getClass(obj,name) { if(obj.currentSt烤恤鹇灭yle) { return obj.currentStyle[name];//IE下获取非行间样式 } else { return getComputedStyle(obj,false)[name];//FF、Chorme下获取费行间样式 } }

7、然后我们想要获取css中的样式就这样写:var w=getClass(document.getElementById('div1'),"width");alert(w);

如何javascript获取css中的样式

8、试试ie,试试火狐.都很ok的啦

如何javascript获取css中的样式
如何javascript获取css中的样式
  • 如何获取json数据传给select选择框
  • jquery怎样去掉某个字符串
  • eclipse如何调整字体大小和显示行宽字数
  • 优雅解决tomcat:/usr/java/packages/lib/amd64
  • 通过Xshell和Xftp远程访问服务器
  • 热门搜索
    新学期新气象的手抄报 勿忘国耻手抄报内容 关于法制教育的手抄报 劳动节的手抄报 国庆节主题手抄报图片 新年手抄报简单又好看 六一手抄报图片 创城手抄报 抗击病毒手抄报内容 小学生英语手抄报