获取HTML页面相关的全局对象和文档位置

Page.js

/**
 * 文档位置相关
 * @param {Object} opt_doc
 */
(function(opt_ns , opt_wind){
    
	var g_win = opt_wind || top ;
	var g_doc = g_win.document ;
	
	var page = {
		
		/**
		 * 获取文档模式
		 * @param {DOMDocument} 文档对象
		 * @return {String}  CSS1Compat ||  BackCompat. 
		 */
		getCompatMode:function(opt_doc){	
			var doc = opt_doc || g_doc				
			return doc.compatMode ;
		},
		
		
		/**
		 * 判断文档是否在标准模式下
		 * @return {Boolean} 标准模式下返回true,兼容模式下返回false
		 * @param {DOMDocument} 文档对象
		 */					
		isCSS1CompatMode:function(opt_doc){
			var doc = opt_doc || g_doc
			return doc.compatMode == 'CSS1Compat'
		},
		
		
		/**
		 * 返回窗口的文档对象
		 * @return {DOMDocument} 窗口的文档对象,如果win为空则返回顶级窗口的文档
		 * @param {DOMWindow} opt_window window对象
		 */
		getDoc:function(opt_window){
			return opt_window == undefined ? g_win.document : opt_window.document ;
		},
		
		
		/**
		 * 获取文档视图的高宽度(不包含滚动条的宽度)
		 * @return {Object} 
		 * @param {Object} opt_window 文档所在窗口
		 */
		getViewportSize:function(opt_window){
			var win = opt_window || g_win ;
			var doc = win.document ;
			//兼容模式下docEl = doc.body
			//标准模式下docEle = doc.documentElement
			var docEl = doc.documentElement
			if(!this.isCSS1CompatMode(doc)){
				docEl =doc.body;
			}
			return {
				height:docEl.clientHeight,
				width:docEl.clientWidth
			}
		},
		
		
		/**
		 * 获取文档视口高度
		 * @return {Number} 文档视口高度
		 * @param {Object} opt_window 文档所在窗口
		 */
		getViewportHeight:function(opt_window){
			return this.getViewportSize(opt_window).height ;
		},
		
		
		/**
		 * 获取文档视口宽度
		 * @return {Number} 文档视口宽度
		 * @param {Object} opt_window 文档所在窗口
		 */
		getViewportWidth:function(opt_window){
			return this.getViewportSize(opt_window).width ;
		},
		
		
		/**
		 * 获取文档高度
		 * @return {Number} 文档高度
		 * @param {Object} opt_window 文档所在窗口
		 */
		getDocHeight:function(opt_window){
			return this.getDocSize(opt_window).height ;
		},
		
		
		/**
		 * 获取文档宽度
		 * @return {Number} 文档宽度
		 * @param {Object} opt_window 文档所在窗口
		 */
		getDocWidth:function(opt_window){
			return this.getDocSize(opt_window).width ;
		},
		
		
		/**
		 * 获取文档高宽度
		 * @return {Object} 文档高宽度
		 * @param {Object} opt_window 文档所在窗口
		 */
		getDocSize:function(opt_window){
			var win = opt_window || g_win ;
			var doc = win.document ;
			var name = "Height";
			
			var docHeight = Math.max(
				doc.documentElement["client" + name],
				doc.body["scroll" + name], doc.documentElement["scroll" + name],
				doc.body["offset" + name], doc.documentElement["offset" + name]
			);
			name = "Width" ;
			var docWidth = Math.max(
				doc.documentElement["client" + name],
				doc.body["scroll" + name], doc.documentElement["scroll" + name],
				doc.body["offset" + name], doc.documentElement["offset" + name]
			);
			return {
				width:docWidth,
				height:docHeight
			}
		},
		
		
		/**
		 * 获取文档竖直方向文档滚动距离
		 * @return {Number} 竖直方向文档滚动距离
		 * @param {Object} opt_window 文档所在窗口
		 */
		getScrollTop:function(opt_window){
			var win = opt_window || g_win ;
			var doc = win.document ;
			return win.pageYOffset || doc.documentElement.scrollTop || doc.body.scrollTop || 0;
		},
		
		
		/**
		 * 获取文档水平方向文档滚动距离
		 * @return {Number} 水平方向文档滚动距离
		 * @param {Object} opt_window
		 */
		getScrollLeft : function(opt_window) {
		   	var win = opt_window || g_win ;
			var doc = win.document ;
		    return win.pageXOffset || doc.documentElement.scrollLeft || docs.body.scrollLeft || 0;
		}
		
	};	
		
	opt_ns = opt_ns || g_win;	
	
	opt_ns.page = opt_ns.page || page  ;
	
})(undefined , window);

ref

• window.scrollX