原生js获取div的高度、padding值

1、原生js获取div的高度

var clientHeight = div.clientHeight

需要注意：clientHeight是算上了padding值、所以不能直接用div.clientHeight，必须clientHeight减去padding值，才是真实高度。

2、通过原生获取padding-top值

var paddingTop = div.style.paddingTop

使用style.paddingTop，该方式只能获取内联样式的padding-top值，而无法获得通过css样式表使用class加载进来的样式。

3、通过getComputeStyle获取padding值

getComputedStyle(document.getElementById(), false)["paddingTop"]

注意：此方法会返回px单位

因为不兼容IE8，所以可以封装个方法：

var getStyle = function(dom, attr){ 

  return dom.currentStyle ? dom.currentStyle[attr] : getComputedStyle(dom, false)[attr];

}

4、获取div的真实高度（不包含padding）

var clientHeight = div.clientHeight

var paddingTop = Number(getStyle(div,"paddingTop").replace(/\s+|px/gi,""))

var paddingBottom = Number(getStyle(div,"paddingBottom").replace(/\s+|px/gi,""))

var height = clientHeight - paddingTop - paddingBottom;

注意：

或许大家看完，会觉得直接使用getStyle(div,"height")获取高度更快。不这样这是因为如果div没有写高度，例如通过里面的内容自动撑开的高度时，在ie8下高度获取出来是"auto"。