currentStyle和getComputedStyle来获取外部样式

时间:2022-09-17 12:43:17

currentStyle和getComputedStyle来获取外部样式

通过document.getElementById(id).style.XXX就可以获取到XXX的值,但意外的是,这样做只能取到通过内嵌方式设置的样式值,即style属性里面设置的值

var mydiv = document.getElementById('mydiv');

if(mydiv.currentStyle) {

var width = mydiv.currentStyle['width'];

alert('ie:' + width);

} else if(window.getComputedStyle) {

var width = window.getComputedStyle(mydiv , null)['width']; //firefox 和 google都可以识别

alert('firefox:' + width);

}

}

currentStyle和getComputedStyle来获取外部样式的更多相关文章

  1. js便签笔记(7)——style、currentStyle、getComputedStyle区别介绍【转载】

    转者语: 今天看jQuery源码CSS部分,里面用到了currentStyle和getComputedStyle来获取外部样式. 因为elem.style.width只能获取elem的style属性里 ...

  2. js中style,currentStyle和getComputedStyle的区别以及获取css样式操作方法

    用js的style只能获取元素的内联样式,内部样式和外部样式使用style是获取不到的. currentStyle可以弥补style的不足(可获取内联样式,内部样式和外部样式),但是只适用于IE. g ...

  3. js中style,currentStyle和getComputedStyle的区别以及获取css操作方法

    在js中,之前我们获取属性大多用的都是ele.style.border这种形式的方法,但是这种方法是有局限性的,该方法只能获取到行内样式,获取不了外部的样式.所以呢下面我就教大家获取外部样式的方法,因 ...

  4. JavaScript获取HTML元素样式的方法(style、currentStyle、getComputedStyle)

    一.style.currentStyle.getComputedStyle的区别 style只能获取元素的内联样式,内部样式和外部样式使用style是获取不到的. currentStyle可以弥补st ...

  5. js获取样式、currentStyle和getComputedStyle的兼容写法

    currentStyle获取计算后的样式,也叫当前样式.最终样式.优点:可以获取元素的最终样式,包括浏览器的默认值,而不像style只能获取行间样式,所以更常用到.注意:不能获取复合样式如backgr ...

  6. style、currentStyle、getComputedStyle(不同浏览器获取css样式)区别介绍

    style.currentStyle.getComputedStyle区别介绍   样式表有三种方式 内嵌样式(inline Style) :是写在Tag里面的,内嵌样式只对所有的Tag有效. 内部样 ...

  7. currentStyle、getComputedStyle 获取样式

    style.height 获取的是行间的样式 currentStyle.height.getComputedStyle(elem,null).height 获取的是 div 的 content 的宽高 ...

  8. Javascript中style,currentStyle和getComputedStyle的区别以及获取css操作方法

    style: 只能获取行内style. 调用:obj.style.属性; 兼容:都兼容 currentStyle: 可以获取该obj所有style,但只可读. 调用:obj.currentStyle[ ...

  9. js中style,currentStyle和getComputedStyle的区别

    1.style只能获取元素的内联样式,内部样式和外部样式是获取不到的.例子: <div id="test" style="width:100px;height:20 ...

随机推荐

  1. CentOS以及Oracle数据库发展历史及各版本新功能介绍&comma; 便于构造环境时有个对应关系

    CentOS版本历史 版本 CentOS版本号有两个部分,一个主要版本和一个次要版本,主要和次要版本号分别对应于RHEL的主要版本与更新包,CentOS采取从RHEL的源代码包来构建.例如CentOS ...

  2. Oracle&colon;分割字符串 取TOP N条记录

    oracle数据库,表数据如下: ids                           id 3,4,5                        7 13,14,15,16         ...

  3. Selenium WebDriver &plus; Grid2 &plus; RSpec之旅(一)----准备篇

    Selenium WebDriver + Grid2 + RSpec之旅(一)             ----准备篇 前言 在Web 2.0 应用中,在浏览器种类盛行的时代,我们在测试过程中不仅要模 ...

  4. proxy&lowbar;pass根据path路径转发时的&quot&semi;&sol;&quot&semi;问题记录

    在nginx中配置proxy_pass时,如果是按照^~匹配路径时,要注意proxy_pass后的url最后的/.当加上了/,相当于是绝对根路径,则nginx不会把location中匹配的路径部分代理 ...

  5. hdu 2870 Largest Submatrix&lpar;平面直方图的最大面积 变形&rpar;

    Problem Description Now here is a matrix with letter 'a','b','c','w','x','y','z' and you can change ...

  6. JS拖拽事件

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. Android 屏幕自适应方向尺寸

    最近感觉要被屏幕适配玩死了…… 安卓的手机为虾米不能像苹果那样只有几个分辨率呢?为什么呢!!!!!!!阿门…… 目前想到有两种解决办法…… 第一种:   HTML5+CSS3+WebView交互……目 ...

  8. CDN加速的实现 --- varnish

    一.什么是CDN cdn全称为内容分发网络(Content Delivery Network).基本思想是尽可能避开互联网上有可能影响数据传输速度和稳定性的瓶颈和环节,是内容传输地更快.更稳定.通过在 ...

  9. 22-THREE&period;JS 面材质

    <!DOCTYPE html> <html> <head> <title>Example 04.05 - Mesh face material</ ...

  10. 并不能来一发50AC

    本来想来一发50AC嗨一下 然后发现只有40+ 算了放弃了..