style.height 获取的是行间的样式

currentStyle.height、getComputedStyle(elem,null).height 获取的是 div 的 content 的宽高,

clientHeight 获取的是 content+padding,

offsetHeight 获取的是content+padding+border。

<script>
window.onload = function(){
var div1 = document.getElementById('div1');
var prop = '';
if(div1.currentStyle){
// IE浏览器下获取行间或样式表样式
prop = div1.currentStyle.height;
}else if(window.getComputedStyle){
// 标准浏览器下获取计算样式,两种写法都可以
// prop = document.defaultView.getComputedStyle(div1,null).height;
prop = window.getComputedStyle(div1,null).height;
}
console.log(prop);
// height:auto; ==》 IE返回的是auto,标准浏览器返回的是实际值
}
</script>

currentStyle、getComputedStyle 获取样式的更多相关文章

  1. style.attr,currentStyle,getComputedStyle获取元素css

    老朋友object.style.attr 平常我们都是使用object.style.attr的方式来获取元素的属性, 但是这种方法具有很大的局限性——只能获取内联样式, 而下面的两种方法可以获取到元素 ...

  2. currentStyle&getComputedStyle获取属性

    方法如下: function getStyle(obj,attr){ if(obj.currentStyle){ return obj.currentStyle[attr]; // IE 中的方法 } ...

  3. JS之获取样式

    基本代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...

  4. getComputedStyle与currentStyle获取样式(style/class)

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

  5. getComputedStyle与currentStyle获取样式

    转载自:https://segmentfault.com/a/1190000007477785 CSS的样式分为三类: 内嵌样式:是写在标签里面的,内嵌样式只对所在的标签有效内部样式:是写在HTML里 ...

  6. style设置/获取样式的问题 和 offsetWidth/offsetHeight的问题

    style设置/获取样式的问题:1.js通过style方法    --加样式:加的是行间样式 oDiv.style.width="20"+'px';    --取样式:取得是行间样 ...

  7. 原生js获取样式

    js中的获取样式是在是让人头疼,为了方便兼容多个浏览器,把设置样式封装成一个函数. 函数如下: function getStyle(element, property) { var value = e ...

  8. 利用原生JavaScript获取样式的方式小结

    来源:http://www.ido321.com/930.html ps:是获取样式,不是设置样式.若没有给元素设置样式值,则返回浏览器给予的默认值.(论坛整理) 1.element.style:只能 ...

  9. style currentStyle getComputedStyle的区别和用法

    先介绍下层叠样式表的三种形式: 1.内联样式,在html标签中style属性设置. <p style="color:#f90">内联样式</p> 2.嵌入样 ...

随机推荐

  1. java-02 JDK安装与环境变量配置&安装编程IDE

    1.JDK下载安装与环境变量的配置 1.1 官方JDK 下载地址 大家可以到Oracle中国官方网站下载JDK,也可已 通过这个链接下载 (推荐大家下载1.8版本,这个版本是当前比较流行的版本) 也可 ...

  2. [LeetCode 题解]: Triangle

    前言   [LeetCode 题解]系列传送门:  http://www.cnblogs.com/double-win/category/573499.html   1.题目描述 Given a tr ...

  3. webUploader 的使用

    地址:http://fex.baidu.com/webuploader/demo.html 这个主要是扒的demo 引用<link href="~/Scripts/webuploade ...

  4. ubuntu 跑.net core 2.0

    安装.net core参考地址:http://www.microsoft.com/net/core/preview#linuxubuntu 服务器版本     UBbuntu  16.04 执行命令 ...

  5. GPU大百科全书 第一章:美女 方程与几何

    沉鱼落雁   前言:当你酣战在星际2的时候,或者当你在艾泽拉斯游历的时候,你有没有想过,眼前的这些绚丽的画面究竟是怎么来的呢?也许对大多数人来说,GPU对于图形的处理过程并不是那么重要,但总会有些人, ...

  6. [51nod] 1090 3个数和为0 暴力+二分

    给出一个长度为N的无序数组,数组中的元素为整数,有正有负包括0,并互不相等.从中找出所有和 = 0的3个数的组合.如果没有这样的组合,输出No Solution.如果有多个,按照3个数中最小的数从小到 ...

  7. “全栈2019”Java第二十五章:流程控制语句中循环语句while

    难度 初级 学习时间 10分钟 适合人群 零基础 开发语言 Java 开发环境 JDK v11 IntelliJ IDEA v2018.3 文章原文链接 "全栈2019"Java第 ...

  8. BZOJ4032: [HEOI2015]最短不公共子串(后缀自动机+序列自动机)

    题目描述 在虐各种最长公共子串.子序列的题虐的不耐烦了之后,你决定反其道而行之. 一个串的“子串”指的是它的连续的一段,例如bcd是abcdef的子串,但bde不是. 一个串的“子序列”指的是它的可以 ...

  9. php数据库编程---mysql扩展库

    1, Java有一种方式操作数据库, PHP有三种方式来操作mysql数据库.(1)mysql扩展库:(2)mysqli扩展库:(3)pdo: 2, mysql扩展库和mysql数据库区别 3, my ...

  10. expect--脚本实现免交互命令

    转自:http://blog.51cto.com/lizhenliang/1607723 注意:使用expect脚本时,需要把脚本添加执行权限,然后./test.sh直接执行,不能用sh或者sourc ...