这是一篇总结性质的日志。目的是使用原生js得到页面的总宽度，高度，左上角坐标，鼠标落点的绝对和相对坐标。
需要兼容的浏览器有IE6，IE8，FF4，Chrome 10，Safari 5，Opera 11。
解释一下为什么不测试Chrome，Safari这些浏览器更早的版本。一是因为他们历代版本在这方面改动不大，基本向后兼容。二是，这些浏览器在中国占有率和使用率都太低了。
下面是总结：
目的：得到页面总宽度
document.body.scrollWidth：全部正确
document.documentElement.scrollWidth：全部正确
document.body.clientWidth：全部正确
目的：得到页面总高度
document.body.scrollHeight：除IE外都正确
document.documentElement.scrollHeight：全部正确document.body.clientHeight：全部正确看来同一批属性在高度和宽度问题上表现并不一致。
目的：得到窗口宽度
self.innerWidth：除IE系列都正确
document.documentElement.clientWidth：全部正确
目的：得到窗口高度
self.innerHeight
document.documentElement.clientHeight
测试结果同上，第二个全部正确
目的：得到窗口左上角绝对坐标Top
document.body.scrollTop：WebKit内核浏览器正确
document.documentElement.scrollTop：其他内核浏览器正确
这两个属性在所有浏览器里都有定义，只是一个正确另一个恒为0。用Math.max取值即可。
目的：得到窗口左上角绝对坐标Left
document.body.scrollLeft
document.documentElement.scrollLeft
结果同上。
目的：得到鼠标点击坐标相对窗口原点坐标X,Y
这个没什么争议，用event.clientX。
目的：得到鼠标点击坐标相对文档原点坐标X,Y
event.offsetX：除FF，其他都正确
event.pageX：除IE系列，全部正确
---------------------总结分割线-------------------------
也许你发现网上其他类似的测试，得出的结论不太一样。可能其他测试结论种对某些值的检测用了更复杂的条件判断。他们不一定对，也不一定错，而我也只是在我所有的浏览器里做了测试，只保证他们在我的浏览器里值是统一的。
所以，结论仅供参考。
/**
* 获取元素的坐标点 * @param elementId 元素Id * @returns 元素所在位置的坐标点 */function getElementPos(elementId) { var ua = navigator.userAgent.toLowerCase(); var isOpera = (ua.indexOf('opera') != -1); var isIE = (ua.indexOf('msie') != -1 && !isOpera); // not opera spoof var el = document.getElementById(elementId); if(el.parentNode === null || el.style.display == 'none') { return false; } var parent = null; var pos = []; var box; if(el.getBoundingClientRect) //IE { box = el.getBoundingClientRect(); var scrollTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop); var scrollLeft = Math.max(document.documentElement.scrollLeft, document.body.scrollLeft); return {x:box.left + scrollLeft, y:box.top + scrollTop}; } else if(document.getBoxObjectFor) // gecko { box = document.getBoxObjectFor(el); var borderLeft = (el.style.borderLeftWidth)?parseInt(el.style.borderLeftWidth):0; var borderTop = (el.style.borderTopWidth)?parseInt(el.style.borderTopWidth):0; pos = [box.x - borderLeft, box.y - borderTop]; } else // safari & opera { pos = [el.offsetLeft, el.offsetTop]; parent = el.offsetParent; if (parent != el) { while (parent) { pos[0] += parent.offsetLeft; pos[1] += parent.offsetTop; parent = parent.offsetParent; } } if (ua.indexOf('opera') != -1 || ( ua.indexOf('safari') != -1 && el.style.position == 'absolute' )) { pos[0] -= document.body.offsetLeft; pos[1] -= document.body.offsetTop; } } if (el.parentNode) { parent = el.parentNode; } else { parent = null; } while (parent && parent.tagName != 'BODY' && parent.tagName != 'HTML') { // account for any scrolled ancestors pos[0] -= parent.scrollLeft; pos[1] -= parent.scrollTop; if (parent.parentNode) { parent = parent.parentNode; } else { parent = null; } } return {x:pos[0], y:pos[1]}; }