Js获取元素样式值(getComputedStyle¤tStyle)兼容性解决方案
因为：style(document.getElementById(id).style.XXX)只能获取元素的内联样式，内部样式和外部样式使用style是获取不到的。
一般js获取内部样式和外部样式使用getComputedStyle，以及currentStyle。
IE下获取元素的实际属性值使用currentStyle属性，getComputedStyle同currentStyle作用相同，但是适用于FF、opera、safari、chrome。但用这种方法在IE7，IE8，IE9获取元素属性值都会报错。
出于对兼容性的考虑，故将两种获取的方法封装在同一个函数中，使其见招拆招，遇到不同的浏览器，自动采取相适应的方法：
<script type="text/javascript">
function getStyle (obj,attr) {
return obj.currentStyle ? obj.currentStyle[attr]:getComputedStyle(obj)[attr];
}
</script>
注意在IE下，如果没有显示的设置元素的值，那么使用该方法获取的值为auto。
<body></body> <script> getStyle(document.body,'height'); </script>
IE6/7/8/9中输出的都是auto。如果显示的设置了宽高，那么输出的就是实际宽高。
css:
body{height:120px;}
<body></body>
<script>
getStyle(document.body,'height');
</script>
Js获取元素样式值(getComputedStyle¤tStyle)兼容性解决方案的更多相关文章
- 原生js获取元素样式
摘要: 我们在开发过程中经常会遇到通过js获取或者改变DOM元素的样式,方法有很多,比如:通过更改DOM元素的class.现在我们讨论原生js来获取DOM元素的CSS样式,注意是获取不是设置 在开始之 ...
- js获取元素位置和style的兼容性写法
今天说一下js获取元素位置和style的方法.当然不只是element.style那么简单.. 主角:getBoundingClientRect,getClientRects,getComputedS ...
- JS获取元素CSS值的各种方法分析
先来看一个实例:如何获取一个没有设置大小的字体? <!DOCTYPE html> <html lang="en"> <head> <met ...
- js获取元素属性值为空的原因和解决办法
问题描述:js获取某元素的属性值为空 代码: <!-- css定义在head中 --> <style> #box{ width: 100px; height: 100px; b ...
- JS获取元素CSS值
一.getComputedStyle getComputedStyle 是一个可以获取当前元素所有最终使用的CSS属性值.返回的是一个CSS样式声明对象([object CSSStyleDeclara ...
- javascript获取元素样式值
使用css控制页面有4种方式,分别为行内样式(内联样式).内嵌式.链接式.导入式. 行内样式(内联样式)即写在html标签中的style属性中,如<div style="width:1 ...
- js获取元素样式
http://blog.sina.com.cn/s/blog_89cd68470101i108.html
- 原生js获取元素的样式信息
工作中经常会需要获取DOM元素的样式,之前都是通过jquery的css()方法,现在总结一下通过原生js获取元素样式的方法. obj.style js var _width = obj.style.w ...
- Vue 获取元素样式 元素高度
看到这个问题我第一时间想的竟然是JS 不知道你是怎么想的 不过昨天有一个小哥哥 问我一个Vue的 哈哈哈 get了 我当时问他为什么不用JS获取 他说 这个性能更高 那我们来看看这个高性能的获取元素高 ...
随机推荐
- 升级Android ADT 和SDK
因为眼下从事android开发工作,所以升级了下Android SDK和eclipse ADT插件 一.更新ADT 1.Eclipse中打开Help->Install New Software. ...
- Android 使用新浪微博SSO授权
新浪微博SSO授权,很早就做好了,只是一直没有时间整理博客,今天加班,晚上闲暇之时便想到整理一下.由于整个七月份很忙,加班很多.前段时间把腾讯微博的SSO认证整理好了.想在七月份翻篇之前再写点东西.好 ...
- Log4Qt 使用（一）
一.下载 http://sourceforge.net/projects/log4qt/develop 二.Log4Qt介绍 Log4Qt 是Apache Log4J 的Qt移植版,所以看Log4J的 ...
- （六）《Java编程思想》——初始化及类的加载顺序
package chapter7; /** * 初始化及类的加载顺序:顺序如下 * 1.基类的static变量 * 2.导出类的static变量 * 3.基类的变量 * 4.基类的构造函数 * 5.导 ...
- 如何获取外网Ip呢， 终于找到方法了
临时更换网址:http://20140507.ip138.com/ic.asp 这个网址能同时获取ip和城市名字 上面的网址如何来的呢,其实很简单,随便打开一个获取Ip的网站,比如http://www ...
- SQL Server 中创建数据库、更改主文件组示例
以下示例在 SQL Server 实例上创建了一个数据库.该数据库包括一个主数据文件.一个用户定义文件组和一个日志文件.主数据文件在主文件组中,而用户定义文件组包含两个次要数据文件.ALTER DAT ...
- 找两个string[ ]里不同的元素
方法 1:string[] strListOne = new string[] {"Type", "Parent Id","Status"} ...
- iOS项目名称、版本号与屏幕分辨率
iOS的版本号,一个叫做Version,一个叫做Build,这两个值都可以在Xcode 中选中target,点击“Summary”后看到. Version在plist文件中的key是“CFBundle ...
- zepto源码研究 - deferred.js（jquery-deferred.js）
简要:zepto的deferred.js 并不遵守promise/A+ 规范,而在jquery v3.0.0中的defer在一定程度上实现了promise/A+ ,因此本文主要研究jquery v3. ...
- for循环删除list元素陷阱
首先我们先看一段代码,如下: List<String> list=new ArrayList<String>(); list.add("123"); lis ...