HTML_BOM-01

1、什么是BOM？

定义：专门用于操作浏览器窗口和访问浏览器软件信息的一套对象和方法的统称

2、BOM与DOM的区别？

DOM :操作对象是浏览器加载的页面文件

BOM：操作对象是浏览器窗口和软件的信息，不负责网页的操作

存在的问题：BOM没有统一的标准，有严重的兼容性问题

3、BOM常用的对象

ndow：表示浏览器窗口

history：对象包含浏览器的历史。

location：对象用于获得当前页面的地址 (URL)，并把浏览器重定向到新的页面。

screen：象包含有关用户屏幕的信息。

navigator：对象包含有关访问者浏览器的信息。

4、window对象：

window对象中在浏览器中既充当了全局作用域，又包含了直接可用的所有原生对象与函数，还是浏览器窗口对象

//获取浏览器窗口的大小
window.outerWidth//表示完整窗口的宽度
window.outerHeight//表示完整窗口高度
window.innerWidth//表示文档显示区宽度
window.innerHeight//表示文档县市区高度
//监控窗口大小的变化
window.onresize=function(){
	console.log(window.innerWidth);
}

剪口窗口并获取滚动距离

<script>
	window.onscroll = function () {
		var scrollTop =
			document.documentElement.scrollTop ||
			document.body.scrollTop;
		console.log(scrollTop);
	}
</script>
//window.scrollTo(0, 垂直方向的位置);

打开和关闭新的窗口：

打开新窗口：window.open("url")
关闭窗口： window.close()

打开新链接4种方式总结:

在当前窗口打开，可后退

 a. html:<a href="url" target="_self">

 b. js: window.open("url", "_self");

原理是使用当前网页使用名字，打开新的网页URL