[TOC]

第一种：
dom.style.width/height
这种方法只能获取使用内联样式的元素的宽和高。

第二种：
dom.currentStyle.width/height
这种方法获取的是浏览器渲染以后的元素的宽和高，无论是用何种方式引入的css样式都可以，但只有IE浏览器支持这种写法。IE9 以上支持。

第三种：
window.getComputedStyle(dom).width/height
这种方法获取的也是浏览器渲染以后的元素的宽和高，但这种写法兼容性更好一些。

第四种：
dom.getBoundingClientRect().width/height
这种方法经常使用的场所是，计算一个元素的绝对位置（相对于视窗左上角），它能拿到元素的left、top、width、height 4个属性。IE9 以上支持，除此外还可以取到相对于视窗的上下左右的距离。

第五种：
dom.offsetWidth/offsetHeight
包括高度（宽度）、内边距和边框，不包括外边距。最常用，兼容性最好。
第六种：
// clientWidth
// clientHeight
// -返回元素的可见宽度和高度:
// 显示时不带px符号，返回的是一个数字，可以直接计算
// 返回的值包括内容区和内边距
// 只读，不可修改
<!DOCTYPE html>