JS BOM

1.window对象

  (1)open("url地址","_black或_self","新窗口的大小")

    如果url为空,则默认打开一个空白页面

    如果打开的方式为空,默认为新窗口方式打开

    返回值:返回新打开的窗口的window对象

  (2)close()关闭当前的网页

    注意该方法在不同的浏览器下表现不一样

    谷歌浏览器直接关闭
    火狐下没效果
    Ie下先弹出弹窗
    如果窗口是通过open()方法打开的,在任何浏览器下都能关闭窗口

var Btn=document.getElementsByTagName("input");
var opener=null;
Btn[0].onclick=function(){
	opener=window.open();
//	window.open("https://www.baidu.com/","_black");
}
Btn[1].onclick=function(){
	/*
	 * 1.ff:默认无法关闭
	 * 2.chrome:默认直接关闭
	 * 3.ie:询问用户是否关闭窗口
	 */
    //	window.close();
    
    //关闭在本页面通过js方式新打开的窗口
    opener.close();
		
}  

  

2.常用属性

  (1)window.navigator.userAgent ->浏览器信息

  (2)window.location ->浏览器地址信息

    window.location.href ->url

    window.location.search ->url问号后面的内容

    window.location.hash ->url#后面的内容

//判断浏览器
if (window.navigator.userAgent.indexOf('MSIE')!=-1) {
	alert("我是ie");
} else{
	alert('我不是ie');
}

  

3.窗口的尺寸与大小

  (1)可视区尺寸

    document.documentElement.clientWidth;

    document.documentElement.clientHeight;

  (2)滚动距离 

    document.body.scrollTop/scrollLeft

    document.documentElement.scrollTop/scrollLeft

  (3)内容高度

    document.body.scrollHeight

  (4)文档高度

    document.documentElement.offsetHeight

    document.body.offsetHeight

//滚动距离兼容性处理
var scrollTop=document.body.scrollTop||document.documentElement.scrollTop;
var scrollLeft=document.body.scrollLeft||document.documentElement.scrollLeft;
var offsetHeight=document.documentElement.offsetHeight||document.body.offsetHeight

  

4.两个窗口事件

  (1)onscroll:当滚动条滚动的时候触发

  (2)onresize:当窗口大小发生改变的时候触发

posted @ 2017-12-27 13:42  carol72  阅读(161)  评论(0编辑  收藏  举报