HTML学习
day6-BOM操作
BOM操作
1.什么是BOM
Browser Object Model(浏览器对象模型)
js默认提供一个 window 对象，指向当前浏览器。其实js中定义的所有的全局变量都是绑定在 window 上的属性。
2.window的基本操作
1）打开新的窗口
a.window.open()
b.window.open（需要加载的网页路径）
c.window.open（需要加载的网页路径,'','width=宽度,height=高度'）
a.创建一个新的窗口并且返回
b.创建一个新的窗口并且返回，窗口中会显示指定网页
c.设置新建窗口的大小
2）关闭窗口
窗口对象.close（）
3）移动窗口
窗口对象.noveTo（x坐标,y坐标）
4）获取窗口大小
a.innerWidth/innerHeight
b.outerWidth/outerHeight
a.获取浏览器能够显示网页内容的有效宽高
b.获取整个浏览器的宽度和高度
弹框
1.只有提示信息和确认按钮的弹框
alter（提示信息）
2.带有确定、取消按钮和提示信息的弹框；根据返回值是true还是false可以确定点击的是确定还是取消
confirm（提示信息）
3.带有确定按钮、取消按钮、文本输入框和提示信息的弹框；
prompt（提示信息，输入框默认值）
如果点击取消按钮，返回值是null；如果点击确定按钮，返回值是输入框中输入的内容
定时操作
window提供了两组不同的定时器函数，用来完成定时功能
1）
a.setInterval(函数,定时时间)
b.clearInterval(定时器对象)
a.每隔指定的时间就调用一次指定的函数（函数会被执行多次）；会返回一个定时器对象
b.停止定时器
2）
a.setTimeout(函数,定时时间)
b.clearTimeout(定时器对象)
a.到了指定的时间，执行函数（函数只会执行1次）；会返回一个定时器对象
b.停止定时器
注意：时间单位是毫秒
事件绑定
1.事件三要素
绑定事件是为了完成一个动作：什么标签发生了什么事情就干什么
事件三要素：事件源（发生什么事件的标签）、事件（发生具体的事情）、事件驱动程序（事件源对事件做出的反应）
2.绑定事件：
事件绑定是绑定在事件源
3.怎么绑定事件
a.给事件源标签的事件属性赋值，如果赋值的时候是函数调用表达式，函数中的this是window
b.通过节点绑定事件1：事件源节点.事件属性 = 事件驱动函数（函数中的this是事件源）
c.通过节点绑定事件2：事件源节点.addEventListener(事件名,函数) (函数中的this是事件源) —— 注意：事件名是去掉 on 的事件名
用addEventListener绑定事件的时候，可以做到给同一个标签的同一个事件同时绑定不同的驱动程序
常用事件类型
每一个事件驱动程序对应的函数在被调用的时候系统都会传一个实参，这个实参就是事件对象；可以根据这个实参事件相关的数据
1.鼠标常用事件（针对所有可见标签有效）
onclick —— 鼠标点击事件
onmouseover —— 鼠标停留在标签上对应的事件
onmouseout —— 鼠标离开标签对应的事件
2.键盘常用事件（一般用于输入框对应的标签）
onkeydown —— 键盘按下
3.onChange事件（一般用于表单相关标签）
onChange —— 值改变事件（value）
4.onload事件
事件捕获
1.事件的传递
作用于子标签的事件会传递给父标签；如果父标签和子标签对同一个事件都进行了绑定，那么如果事件发生在子标签上，子标签和父标签都会响应事件
2.事件捕获
事件捕获就是阻止事件传递给父标签
事件对象.stopPropagation()
