clientWidth：可视区宽 说明：样式宽+padding
clientHeight：可视区高 说明：样式高+padding
elem.clientWidth //获取元素的样式宽+padding
document.documentElement.clientWidth //获取文档的样式宽+padding
例子说明：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> #d1{width:100px;height:100px;background:red;padding:50px;margin:50px;border:10px solid black;} </style> </head> <body> <div id="d1"></div> <script> var dom = document.getElementById(‘d1‘); console.log(dom.clientWidth + ‘,‘ + dom.clientHeight); console.log(document.documentElement.clientWidth + ‘,‘ + document.documentElement.clientHeight); </script> </body> </html>
ie7/ie9:
原文：http://www.cnblogs.com/gongshunkai/p/5864837.html