WebAPI之DOM和BOM

API是什么？

Application Programming Interface：应用程序编程接口，是一些预先定义的函数，通俗的理解就是一些方法。

WebAPI是什么？

浏览器提供的一套操作浏览器功能和页面元素的API。

此处的Web API特指浏览器提供的一些方法。可分为两个部分：BOM(浏览器对象模型)、DOM（页面对象模型）

DOM

DOM的概念

文档对象模型（Document Object Model，简称DOM），是W3C组织推荐的处理可扩展标志语言的标准编程接口。在网页上，组织页面（或文档）的对象被组织在一个树形结构中，用来表示文档中对象的标准模型就称为DOM。

根据ID获取元素（返回拥有ID 的第一个对象的引用）

根据标签名获取元素（返回带有标签名的对象集合）

根据name获取元素（返回带有指定名称的对象集合）

根据类名获取元素（返回文档中所有指定类名的元素集合）

根据选择器获取元素（返回文档中匹配指定CSS选择器的第一个元素，如果要返回所有：querySelectorAll( )方法）

BOM

BOM的概念

BOM(Browser Object Model) 是指浏览器对象模型，浏览器对象模型提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。BOM由多个对象组成，其中代表浏览器窗口的Window对象是BOM的顶层对象，其他对象都是该对象的子对象。

BOM顶级对象之window

调用window下的属性和方法时，可以省略window

innerWidth 和 innerHeight 属性

innerheight 返回窗口的文档显示区的高度。

innerwidth 返回窗口的文档显示区的宽度

history对象（用户(在浏览器窗口中)访问过的 URL）

back( )　　加载 history 列表中的前一个 URL

forward( )　　加载 history 列表中的下一个 URL

go( )　　加载 history 列表中的某个具体页面。

back( ) :

forward( ) :

go( ) :

Navigator 对象包含有关浏览器的信息。

serAgent属性　　判断用户浏览器的类型

platform属性　　判断浏览器所在的操作系统和平台类型

serAgent属性：

platform属性：

location对象（包含当前URL信息）

属性：

host　　设置或返回主机名和当前 URL 的端口号

hostname　　设置或返回当前 URL 的主机名

href　　设置或返回完整的URL

pathname　　设置或返回当前URL的路径部分

port 　　设置或返回当前URL的端口号

protocol 　　设置或返回当前URL的协议

search 　　设置或返回从问号 (?) 开始的 URL（查询部分）

三种对话框

• alert()
• confirm()
• prompt()

　　alert是警告框（模态框），只有一个按钮“确定”无返回值

　　confirm是确认框（模态框），有确定和取消两个按钮，用户点击确认，返回值为 true。如果点击取消，则返回值为 false

　   prompt是提示框（模态框），返回输入的消息，用户点击确认，返回值为输入的值。如果点击取消，则返回值为 null

页面加载事件

onload：

页面和图片加载完成后立即触发，重载页面也会触发

onunload：

页面下载时触发（或者浏览器窗口已关闭），重载页面也会触发