HTML BOM（Brower Object Model）5个常见对象的属性方法整理

1) windows对象：

属性：Window 对象表示浏览器中打开的窗口。

如果文档包含框架，浏览器会为 HTML 文档创建一个 window 对象，并为每个框架创建一个额外的 window 对象。

Note注意： 没有应用于 window 对象的公开标准，不过所有浏览器都支持该对象。

Window 对象属性

调用语法：window.属性名

属性 描述
name 设置或返回窗口的名称。
parent 返回父窗口。
closed 返回窗口是否已被关闭。
self 返回对当前窗口的引用。等价于 Window 属性。
length 设置或返回窗口中的框架数量。
top 返回最顶层的父窗口。
opener 返回对创建此窗口的窗口的引用。
status 设置窗口状态栏的文本。
defaultStatus 设置或返回窗口状态栏中的默认文本。
document 对 Document 对象的只读引用。(请参阅对象)
frames 返回窗口中所有命名的框架。 该集合是 Window 对象的数组，每个 Window 对象在窗口中含有一个框架。
history History 对象的只读引用。请参数 History 对象。
location 用于窗口或框架的 Location 对象。请参阅 Location 对象。
navigator 对 Navigator 对象的只读引用。请参数 Navigator 对象。
screen 对 Screen 对象的只读引用。请参数 Screen 对象。
screenLeft 返回相对于屏幕窗口的x坐标
screenTop 返回相对于屏幕窗口的y坐标
screenX 返回相对于屏幕窗口的x坐标
screenY 返回相对于屏幕窗口的y坐标
innerHeight 返回窗口的文档显示区的高度。
innerWidth 返回窗口的文档显示区的宽度。
outerHeight 返回窗口的外部高度，包含工具条与滚动条。
outerWidth 返回窗口的外部宽度，包含工具条与滚动条。
pageXOffset 设置或返回当前页面相对于窗口显示区左上角的 X 位置。
pageYOffset 设置或返回当前页面相对于窗口显示区左上角的 Y 位置。

Window 对象方法

方法 描述
alert() 显示带有一段消息和一个确认按钮的警告框。
prompt() 显示可提示用户输入的对话框。
confirm() 显示带有一段消息以及确认按钮和取消按钮的对话框。

focus() 把键盘焦点给予一个窗口。
blur() 把键盘焦点从顶层窗口移开。
createPopup() 创建一个 pop-up 窗口。

open() 打开一个新的浏览器窗口或查找一个已命名的窗口。
close() 关闭浏览器窗口。
print() 打印当前窗口的内容。

scroll() window窗口右侧滚动条
scrollBy() 按照指定的像素值来滚动内容。
scrollTo() 把内容滚动到指定的坐标。

setInterval() 按照指定的周期（以毫秒计）来调用函数或计算表达式。
setTimeout() 在指定的毫秒数后调用函数或计算表达式。
clearInterval()取消由 setInterval() 设置的 timeout。
clearTimeout() 取消由 setTimeout() 方法设置的 timeout。

IE moveBy() 可相对窗口的当前坐标把它移动指定的像素。
IE moveTo() 把窗口的左上角移动到一个指定的坐标。
IE resizeBy() 按照指定的像素调整窗口的大小。
IE resizeTo() 把窗口的大小调整到指定的宽度和高度。

举个栗子：

定义button控件作为访问window对象的入口：
 <input type="button" value="打开 window" onclick="openWin()" />
 JS代码：
 <script>
 function openWin(){
     Window=window.open('','','width=200,height=100');
     Window.document.write("<p>这是 “我的窗口”</p>");
     Window.blur();
 }
 </script>

补充

Window 事件属性

针对 window 对象触发的事件（应用到body标签中）：

属性 值 描述
onload script 页面结束加载之后触发。
onerror script 在错误发生时运行的脚本。
onafterprint script 文档打印之后运行的脚本。
onbeforeprint script 文档打印之前运行的脚本。
onhaschange script 当文档已改变时运行的脚本。
onbeforeunload script 文档卸载之前运行的脚本。
onmessage script 在消息被触发时运行的脚本。
onoffline script 当文档离线时运行的脚本。
ononline script 当文档上线时运行的脚本。
onpagehide script 当窗口隐藏时运行的脚本。
onpageshow script 当窗口成为可见时运行的脚本。
onpopstate script 当窗口历史记录改变时运行的脚本。
onredo script 当文档执行撤销（redo）时运行的脚本。
onresize script 当浏览器窗口被调整大小时触发。
onstorage script 在 Web Storage 区域更新后运行的脚本。
onundo script 在文档执行 undo 时运行的脚本。
onunload 一旦页面已下载时触发（或者浏览器窗口已被关闭）。

Form 事件

由 HTML 表单内的动作触发的事件（应用到几乎所有 HTML 元素，但最常用在 form 元素中）：
属性 值 描述
onblur script 元素失去焦点时运行的脚本。
onchange script 在元素值被改变时运行的脚本。
onselect script 在元素中文本被选中后触发。
onsubmit script 在提交表单时触发。
onfocus script 当元素获得焦点时运行的脚本。
onformchange script 在表单改变时运行的脚本。
onforminput 当表单获得用户输入时运行的脚本。
oninput script 当元素获得用户输入时运行的脚本。
oninvalid script 当元素无效时运行的脚本。
oncontextmenu script 当上下文菜单被触发时运行的脚本。
onreset script 当表单中的重置按钮被点击时触发。HTML5 中不支持。

Keyboard 事件

属性 值 描述 onkeydown script 在用户按下按键时触发。 onkeypress script 在用户敲击按钮时触发。 onkeyup script 当用户释放按键时触发。

Mouse 事件

由鼠标或类似用户动作触发的事件：

属性 值 描述
onclick script 元素上发生鼠标点击时触发。
ondblclick script 元素上发生鼠标双击时触发。
ondrag script 元素被拖动时运行的脚本。 ondragstart script 在拖动操作开端运行的脚本。
ondragend script 在拖动操作末端运行的脚本。 ondragleave 当元素离开有效拖放目标时运行的脚本。
ondragenter 当元素元素已被拖动到有效拖放区域时运行的脚本。
ondragover 当元素在有效拖放目标上正在被拖动时运行的脚本。
ondrop script 当被拖元素正在被拖放时运行的脚本。
onmousedown script 当元素上按下鼠标按钮时触发。
onmousemove script 当鼠标指针移动到元素上时触发。
onmouseout script 当鼠标指针移出元素时触发。
onmouseover script 当鼠标指针移动到元素上时触发。
onmouseup script 当在元素上释放鼠标按钮时触发。
onmousewheel 当鼠标滚轮正在被滚动时运行的脚本。
onscroll script 当元素滚动条被滚动时运行的脚本。

2)Navigator 对象

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

注意： 没有应用于 navigator 对象的公开标准，不过所有浏览器都支持该对象。

Navigator 对象属性

属性 说明
appCodeName 返回浏览器的代码名
appName 返回浏览器的名称
appVersion 返回浏览器的平台和版本信息
cookieEnabled 返回指明浏览器中是否启用 cookie 的布尔值
platform 返回运行浏览器的操作系统平台
userAgent 返回由客户机发送服务器的user-agent 头部的值

Navigator 对象方法

方法 描述
javaEnabled() 指定是否在浏览器中启用Java;
taintEnabled() 规定浏览器是否启用数据污点(data tainting)
三、实例

<div id="example"></div>
 <script>
 txt = "<p>浏览器代号: " + navigator.appCodeName + "</p>";
 txt+= "<p>浏览器名称: " + navigator.appName + "</p>";
 txt+= "<p>浏览器版本: " + navigator.appVersion + "</p>";
 txt+= "<p>启用Cookies: " + navigator.cookieEnabled + "</p>";
 txt+= "<p>硬件平台: " + navigator.platform + "</p>";
 txt+= "<p>用户代理: " + navigator.userAgent + "</p>";
 txt+= "<p>用户代理语言: " + navigator.systemLanguage + "</p>";
 document.getElementById("example").innerHTML=txt;
 </script> 

 结果：
 浏览器代号: Mozilla
 浏览器名称: Netscape
 浏览器版本: 5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.61 Safari/537.36
 启用Cookies: true
 硬件平台: Win32
 用户代理: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.61 Safari/537.36
 用户代理语言: undefined

3）Screen 对象

Screen 对象包含有关客户端显示屏幕的信息。

Note注意： 没有应用于 screen 对象的公开标准，不过所有浏览器都支持该对象。

Screen 对象属性
属性 说明
height 返回屏幕的总高度
width 返回屏幕的总宽度
availHeight 返回屏幕的高度（不包括Windows任务栏）
availWidth 返回屏幕的宽度（不包括Windows任务栏）
colorDepth 返回目标设备或缓冲器上的调色板的比特深度
pixelDepth 返回屏幕的颜色分辨率（每象素的位数）

4）History 对象

History 对象
History 对象包含用户（在浏览器窗口中）访问过的 URL。

History 对象是 window 对象的一部分，可通过 window.history 属性对其进行访问。

注意： 没有应用于History对象的公开标准，不过所有浏览器都支持该对象。

History 对象属性
属性 说明
length 返回历史列表中的网址数

History 对象方法
方法 说明
back() 加载 history 列表中的前一个 URL
forward() 加载 history 列表中的下一个 URL
go() 加载 history 列表中的某个具体页面

5）.Location 对象

Location 对象包含有关当前 URL 的信息。

Location 对象是 window 对象的一部分，可通过 window.Location 属性对其进行访问。

注意： 没有应用于Location对象的公开标准，不过所有浏览器都支持该对象。

Location 对象属性
属性 描述
href 返回完整的URL
hash 返回一个URL的锚部分
host 返回一个URL的主机名和端口
hostname 返回URL的主机名
protocol 返回一个URL协议
pathname 返回的URL路径名。
search 返回一个URL的查询部分