javascript--window对象及宽高、位置、滚动条

我会带着你远行 2022-05-16 12:57 185阅读 0赞

//window的属性，大部分都是只读的，不支持设置，这里也就不一一分析。使用的时候window全部作为只读看待，不要设置。
    //为了简便，除非特殊说明，此文档中的document.body代表元素（标签）
    //一些需要兼容地方，也都有体现，没有过多解释。
    
    /*获取常用对象：这里的每个对象都是一个完整的体系，都要掌握*/
    window.location
    window.history
    window.localStorage
    window.sessionStorage
    window.navigator
    window.document
    window.screen
    /*其他：很不常用*/
    	//	closed 	返回窗口是否已被关闭。
    	//	defaultStatus 	设置或返回窗口状态栏中的默认文本。
    	//	frames 	返回窗口中所有命名的框架。该集合是 Window 对象的数组，每个 Window 对象在窗口中含有一个框架。
    	//	length 	设置或返回窗口中的框架数量。
    	//	name 	设置或返回窗口的名称。
    	//	opener 	返回对创建此窗口的窗口的引用。
    	//	parent 	返回父窗口。
    	//	self 	返回对当前窗口的引用。等价于 Window 属性。
    	//	status 	设置窗口状态栏的文本。
    	//	top 	返回最顶层的父窗口。
    
    /*获取大小、位置、滚动条*/
    	//获取浏览器相对于屏幕的坐标
    		window.screenLeft;/*window.screenX;*/
    		window.screenTop;/*window.screenY;*/
    	//获取窗口大小：对应三大家族记忆
    		//offset：获取元素的总大小---获取元素相对于位置
    			document.body.offsetHeight
    			document.body.offsetWidth
    			document.body.offsetTop
    			document.body.offsetLeft
    			document.body.offsetParent
    		//获取窗口的外部高度（包含工具条与滚动条）
    			window.outerHeight
    			window.outerWidth
    		
    		//scroll：获取元素内容的实际大小----获取元素的滚动距离
    			document.body.scrollHeight
    			document.body.scrollHeight
    			document.body.scrollHeight
    			document.body.scrollHeight
    		//获取窗口的文档显示区的大小----获取窗口的滚动距离（内部高度）
    			window.innerHeight
    			window.innerWidth
    			window.pageXOffset;/*IE*/ 
    			window.pageYOffset
    			//IE下使用html的滚动距离代替window的滚动
    			document.documentElement.scrollTop
    			document.documentElement.scrollLeft
    		
    		//client：获取元素可是区域的大小
    			document.body.clientHeight
    			document.body.clientWidth
    			
    			
    			
    /*测试*/
    setInterval(function(){
    	
    },1000)