详解javascript中offsetTop/Left、offsetWidth/Height、clientWidth/clientHeight

javascript中获取元素的尺寸位置等，有好多个属性（clientWidth,clientHeight,offsetWidth,offsetHeight,scrollWidth,scrollHeight）等，本文主要介绍各自属性的意义。

一、对于获取div尺寸

clientWidth = width + padding


clientHeight = height + padding


offsetWidth = width + padding + border


offsetHeight = height + padding + border

二、对于获取整个网页尺寸

网页可见区域宽： document.body.clientWidth
网页可见区域高： document.body.clientHeight
网页可见区域宽： document.body.offsetWidth (包括边线的宽IE8，chrome中=clientWidth)
网页可见区域高： document.body.offsetHeight (包括边线的高IE8,chrome中=scrollHeight)
网页正文全文宽： document.body.scrollWidth
网页正文全文高： document.body.scrollHeight
屏幕分辨率的高： window.screen.height
屏幕分辨率的宽： window.screen.width
屏幕可用工作区高度： window.screen.availHeight
屏幕可用工作区宽度： window.screen.availWidth

三、测试例子

	
	

	

	


	
		
	
	
		在w3school，你可以找到你所需要的所有的网站建设教程。
	
	

	
	



	

结果截图：