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:当窗口大小发生改变的时候触发