11、BOM

一、BOM

(一)window

1、基本概念

(1)全局变量都是window对象的属性,使用时可以省略window对象 (2)若函数内没有通过var声明的变量,会被当做全局变量 (3)把变量尽量声明在函数体内部,可以有效减少全局环境下的变量冲突,避免污染全局环境

*避免全局污染,全局变量起名,尽量不要起name	op
*避免命名冲突

(4)全局变量无法使用delete删除 (5)一般window的方法可以省略window的调用。

1 例:window.alert()可以省略wondow

(6)window对象本身存在的属性及事件,调用的时候尽量不要省略window的调用,以及不要对window本身存在的属性赋值!!!

(二)window的属性(常用属性)

1、 浏览器窗口尺寸

(1) window.innerWidth、window.innerHeight :表示浏览器窗口”可视区域”尺寸
(2) window.outerWidth/window.outerHeight :表示浏览器窗口尺寸

2、与滚动相关窗口尺寸

(1) scrollX//scrollY :获取浏览器窗口滚动过的距离
(2) scrollTo(x,y) :设置浏览器滚动到的位置
(3) scrollBy(x,y) :设置相对于当前滚动位置滚动的距离(往左、上为负值,往右、下为正值)

3、window的事件(滚动)

(1)window.onscroll :浏览器滚动条滚动时触发函数
备注: 在js中获取页面元素,返回的都是对象

4、属性对象

(1)history (重要):历史对象,包含窗口的浏览历史,可实现后退
(1.1)属性:
lenght返回浏览器历史列表中的URL数量

(1.2)方法:
*back()加载history列表中的前一个URL
        *forward()加载history列表中的下一个URL
        *go()加载history列表中的下一个URL
            *history.go(2);向前两个页面
            *history.go(-2);后退两个页面
(2)location(重要):保存文档的相关信息

备注:location是BOM最有用的对象之一,保存着当前窗口中加载文档的相关信息,还提供一些导航功能,它是个很特别的对象,既是window的属性,也是document的属性 。


(2.1)属性:
*href :设置或返回完整的URL
*hash :设置或返回从井号(#)开始的URL(锚)==>哈希值
*search:设置或者返回从问号(?)开始的URL(查询部分)。
URL的参数
*encodeURI() : 转码
*decodeURI():解码
备注:修改以上属性(hash除外)都会刷新当前页面,并生成历史纪录

(2.2)方法:
*reload() 重新加载当前文档,带参数true表示不使用缓存刷新页面。
(3)navigator(了解):
备注:
导航对象, 包含所有有关访问者浏览器的信息,通常用于检测浏览器类型
(3.1)appName 浏览器名称
(3.2)appVersion 浏览器版本
(3.3)platform 操作系统
(3.4)userAgent 用户代理信息,通过该属性可以获取浏览器及操作系统信息
(3.5)geolocation 获取地理位置信息
(4)window对象常用事件
(4.1)onload :页面资源全部加载完成后触发这个事件
(4.2)onscroll:窗口滚动条滚动时触发
(4.3)onresize:窗口大小改变时触发

(三)window常用方法(了解)

1、系统对话框
(1.1)alert(msg)//弹出对话框
(1.2)confirm(msg)//弹出警告框,返回布尔值
(1.3)prompt(msg,default)//弹出输入框,返回消息或null
备注:以上三个方法都会暂停代码的执行
(1.4)open(url,name,[options]) : 打开一个新窗口并返回新 window 对象
*、name:不命名会每次打开新窗口,命名的第一次打开新窗口,之后在这个窗口中加载
*、options为字符串:'width=400,height=400,top=200,left=200'
*、opener父窗口对象,通过open方法打开的窗口才有opener对象
(1.5)close(): 关闭窗口
(1.6)print(): 调出打印对话框
原文地址:https://www.cnblogs.com/wulongke/p/10493169.html