一般我们利用element.style.属性来获取CSS的样式,而此方法只能获取标签内的样式,无法获取头部或引入的样式,因此,而我们又需要获取其样式,则我们可以使用:(其中element为标签,proName为属性)
document.defaultView.getComputedStyle(element)[proName]的方法获其样式,
而此方法不支持IE6~IE8,因此我们针对IE8以下的使用
element.currentStyle[proName]

我们可以通过下面方法使其兼容

 /*
* 功能: 通过属性名获取传入标签渲染后的样式
* 参数: 第一个参数表示你想要获取其属性值的标签; 第二个参数表示你想要获取其属性值的属性名
* 返回值: 返回第一个参数标签里面的属性名为第二个参数的样式
*/
function getStyle(element, proName) {
// document.defaultView.getComputedStyle为标准浏览器方法,element.currentStyle兼容IE6~IE8
return document.defaultView ? document.defaultView.getComputedStyle(element)[proName] : element.currentStyle[proName];
}

JS获取渲染后的样式的更多相关文章

  1. js获取计算后的样式表

    在编写html时,使用dom对象的style属性可以获取标签里的style属性,但是不能获取单独css样式文件或者style标签的属性值 <div style="width:10px& ...

  2. js获取css的各种样式并且设置他们

    js原生获取css样式,并且设置,看似简单,其实并不简单,我们平时用的ele.style.样式,只能获取内嵌的样式,但是我们写的样式基本都在style属性里面; 这里我们就需要: 下面这个代码主要是设 ...

  3. JS获取元素属性、样式getComputedStyle()和currentStyle方法兼容性问题

    1. getComputedStyle()  方法获取到的是经过计算机/浏览器计算后的样式 getComputedStyle($("#div")).width; 兼容性:IE6 7 ...

  4. 原生js获取元素非行内样式属性的方法

    获取当前对象的样式DOM标准中的全局方法 getComputedStyle(obj).width (获取元素的宽度),但在非标准IE浏览器(IE8)以下有兼容问题IE8以下要这样写 obj.curre ...

  5. 【javascript】js 获取 url 后的参数值

    以前写过一篇类似的博文(提取 url 的搜索字符串中的参数),但是个人觉得使用起来不是很方便,今天抽空重新写了个函数,该函数代码更加简洁. //获取 url 后的参数值 function getUrl ...

  6. js获取dom对象style样式的值

    js获取到的dom对象的style通常是没有值得,因为我们都写在外部文件中,从慕课网上见到讲师封装的一个方法,挺不错.特此记录下来. function getStyle(obj,attr){ if(o ...

  7. js获取css中的样式

    众所周知,obj.style只能够获取 <div id="a" style="width:100px;"></div> 结构上的样式 如 ...

  8. js获取url?后的参数

    function GetRequest() { var url = location.search; //获取url中"?"符后的字串 var theRequest = new O ...

  9. JS获取验证码后倒计时不受刷新及关闭影响

    HTML部分 <input type="button" id="code_btn" value="获取验证码"> JS部分 // ...

随机推荐

  1. 跑Java -jar somefile.jar时会发生什么(一个)

    最近阅读JVM源代码.一些想法写Blog分享.于是,他开了这么一个新课题. 第一篇文章取名字的时候让我很困惑,我代码的阅读是从Launcher開始入手的,也就是Java.exe(假设是windows平 ...

  2. tomcatserver解析(六)-- Acceptor

    Acceptor负责用来管理连接到tomcatserver的数量,来看看Acceptor在tomcatserver中的应用,是怎样实现连接管理的,socket连接建立成功之后,是怎样实现内容的读写的( ...

  3. Codeforces Round #274 (Div. 2) B. Towers

    As you know, all the kids in Berland love playing with cubes. Little Petya has n towers consisting o ...

  4. MVC中下拉框显示枚举项

    原文:MVC中下拉框显示枚举项 本篇将通过3种方式,把枚举项上的自定义属性填充到下拉框: 1.通过控制器返回List<SelectListItem>类型给前台视图 2.通过为枚举类型属性打 ...

  5. 使用 Advanced Installer 打包 一键安装Web应用程序

    原文:使用 Advanced Installer 打包 一键安装Web应用程序 安装预览: 资源下载: 示例安装包 操作流程: 1.新建Asp.net Application. 2.设置应用程序名称和 ...

  6. 比ORA-24777: 我不使用不可移植数据库链接更郁闷的事情达成一致

    现场有一个同步误差,内容如下面:    java.sql.BatchUpdateException: ORA-24777: 不同意使用不可移植的数据库链路    at oracle.jdbc.driv ...

  7. ASP.NET MVC:Razor 引入命名空间

    原文:ASP.NET MVC:Razor 引入命名空间 页面中引用 c# @using MvcApplication83.Models @using MvcApplication83.Common 行 ...

  8. Group By去除重复数据

    今天在写一个sql,目的是去除表里某一个字段相同的数据,只保留最新的一条.之前group by 用的少.特此记录一下. SELECT * FROM litb_approval_task SELECT ...

  9. 使用reserve要再次避免不必要的分配

     关于STL容器,最了不起的一点是,它们会自己主动增长以便容纳下你放入当中的数据,仅仅要没有超出它们的最大限制就能够.对于vector和string,增长过程是这样来实现的:每当须要很多其它空间时 ...

  10. thinkphp学习笔记9—自动加载

    原文:thinkphp学习笔记9-自动加载 1.命名空间自动加载 在3.2版本中不需要手动加载类库文件,可以很方便的完成自动加载. 系统可以根据类的命名空间自动定位到类库文件,例如定义了一个类Org\ ...