javascript浏览器对象模型 BOM

最新推荐文章于 2020-12-14 22:27:40 发布

loren_123

最新推荐文章于 2020-12-14 22:27:40 发布

阅读量450

点赞数

分类专栏： javascript

本文链接：https://blog.youkuaiyun.com/loren_123/article/details/81561619

版权

javascript 专栏收录该内容

7 篇文章

订阅专栏

本文介绍了JavaScript中的浏览器对象模型（BOM），重点讲解了window对象的属性和方法，如窗口尺寸、navigator对象、Screen对象、History对象以及Location对象的属性和方法。BOM在不同浏览器间的实现可能存在差异，但所有浏览器都支持这些对象。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

浏览器对象模型尚无正是标准

window对象

全局变量是window对象的属性

全局函数是window对象的方法

window尺寸

1. 对于Internet Explorer、Chrome、Firefox、Opera以及Safari

window.innerHeight - 浏览器窗口的内部高度(包括滚动条)
window.innerWidth - 浏览器窗口的内部宽度(包括滚动条)

2. 对于Internet Explorer8、7、6、5

document.documentElement.clientHeight
document.documentElement.clientWidth

或者

document.body.clientHeight
document.body.clientWidth

window对象属性

1. closed：返回窗口是否已被关闭(window.closed)

2. defaultStatus：设置返回窗口状态栏中的默认文本(只有opera支持)

3. docement：对Document对象的只读引用。

4. frames：返回窗口中所有命名的框架。该集合是Window对象中的数组，每个Window对象在窗口中含有一个框架

var frames = window.frames; 通过frames.length获取<iframe></iframe>框架的数量

5. history：对history对象的只读引用

6. innerHeight、innerWidth 返回窗口文档显示区的高度、宽度

7. localStorage：在浏览器中存储key/value对，没有过期时间。

localStorage.setItem(key, value) 和 localstorage.getItem(key) 分别设置和读取localStorage

8. length：设置或返回窗口中框架数量

9. name：设置或返回窗口的名称

10. navigator：对navigator对象的只读引用

11. opener：返回对创建此窗口的窗口的引用

当使用window.open()打开一个窗口，您可以使用此属性返回来自目标窗口源（父）窗口的详细信息

12. outerHeight、outerWidth：返回窗口的外部高度、宽度，包含工具条和滚动条(IE8及更早IE版本不支持该属性)

get：window.outerWidth；window.outerHeight
set：window.outerWidth=pixels；window.outerHeight=pixels

13. pageXOffset、pageYOffset设置或返回当前页面相对于窗口显示区左上角X、Y的位置

pageXOffset 和 pageYOffset 属性返回文档在窗口左上角水平和垂直方向滚动的像素。
pageXOffset 和 pageYOffset 属性相等于 scrollX 和 scrollY 属性

14. parent：返回当前窗口的父窗口

15. screen：对Screen对象的只读引用

16. screenLeft、screenTop 返回相对于屏幕窗口的X坐标、Y坐标

该属性火狐不支持，火狐浏览器使用window.screenX 、window.screenY

17. screenX、screenY属性返回窗口相对于屏幕的X和Y坐标。

IE不支持， IE浏览器使用。 window.screenLeft 和 windwo.screenTop获得相同的值

18. self：返回对当前窗口的引用。等价于 Window 属性

19. status：设置窗口状态栏的文本(只有opera支持)

20. top：返回最顶层的父窗口

window对象方法

1. alter：显示带有一段消息和一个确认按钮的警告框

2. blur：把键盘焦点从顶层窗口移开

3. clearInterval、clearTimeout：取消定时器

4. close：关闭浏览器窗口

5. confirm：显示一个带有一段消息以及确认按钮和取消按钮的对话框

6. createPopup：创建一个pop-up 窗口

7. focus：把键盘焦点给予一个窗口

8. moveBy：可相对窗口的当前坐标把它移动指定的像素

9. moveTo：把窗口的左上角移动到一个指定的坐标

moveBy 和 moveTo区别：moveTo移动到指定的位置，moveBy相对于之前的位置移动指定像素。

10. 打开一个新的浏览器窗口或查找一个已命名的窗口

语法：window.open(url, name, features, replace)

参数：url新窗口中显示的文档url，如果省略或者这个它的值为空，新窗口就不会显示任何文档

name：字符串，声明新窗口的名称。这个名称可以用标记<a>和<from>属性target的值，如果该参数只当一个已经存在的窗口，那么open()方法就不再创建一个新窗口，而只是返回指定窗口的引用。

features：一个可选的字符串，声明了新窗口要显示的标准浏览器的特征

replace：一个可选的布尔值。规定了装载到窗口的 URL 是在窗口的浏览历史中创建一个新条目，还是替换浏览历史中的当前条目

11. print：打印当前窗口的内容

12. prompt：显示可提示用户输入的对话框

语法：prompt(text, defaultText)

13. resizeBy：按照指定的像素调整窗口的大小

14. resizeTo：把窗口的大小调整到指定的宽度和高度

15. scrollBy：按照指定的像素值来滚动内容

16. scrollTo：把内容滚动到指定的坐标

17. setInterval、setTimeout设置定时器

navigator对象

navigator对象包含相关浏览器的信息。没有应用于 navigator 对象的公开标准，不过所有浏览器都支持该对象

navigator对象集合

plugins：返回对文档中所有嵌入式对象的引用

该集合是一个 Plugin 对象的数组，其中的元素代表浏览器已经安装的插件。Plug-in 对象提供的是有关插件的信息，其中包括它所支持的 MIME 类型的列表

navigator对象属性

1. appCodeName：返回浏览器的代码名

2. appMinorVersion：返回浏览器的次机版本

3. appName：返回浏览器的名称

4. appVersion：返回浏览器的平台和版本信息

5. browserLanguage：返回当前浏览器的语言

6. cookieEnabled：返回指明卢岚气中是否启用cookie的布尔值

7. cpuClass：返回浏览器系统的CPU等级

8. onLine：返回指明系统是否处于脱机模式的布尔值

9. platform：返回浏览器的操作系统平台

10. systemLanguage：返回OS使用的默认语言

11. userAgent：返回由客户机发送服务器的user-agent头部的值

12. userlanguage：返回OS的自然语言设置

navigator对象方法

1. javaEnabled：固定浏览器是否启用Java

2. taintEnabled：规定浏览器是否启用数据污点(data tainting)

Screen对象

Screen 对象包含有关客户端显示屏幕的信息，没有应用于 screen 对象的公开标准，不过所有浏览器都支持该对象

Screen对象属性

1. availHeight、avail Width：返回显示屏幕的高度、宽度(出window任务栏之外)

2. bufferDepth：设置或返回调色板的比特深度

3. colorDepth：返回目标设备或缓冲器上的调色板的比特深度

4. deviceXDPI、deviceYDPI：返回显示屏幕的每英寸水平、垂直点数

5. fontSmoothingEnabled：返回用户是否在显示控制面板中启用了字体平滑

6. height、width：返回显示屏的高度、宽度

7. logicalXDPI、logicalYDPI：返回显示屏没英寸的水平、垂直方向的常规点数

8. pixelDepth：返回显示屏幕的颜色分辨率（比特每像素）

9. updateInterval：设置或返回屏幕的刷新率

History对象

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

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

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

history对象属性

length：返回浏览器历史列表中的URL数量

history对象方法

1. back：加载History列表中的前一个URL

2. forward：加载History列表中的下一个URL

3. go：加载History列表中的某个具体页面

Location对象

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

Location 对象是 Window 对象的一个部分，可通过 window.location 属性来访问。

Location对象属性

1. hash：设置或返回从井号 (#) 开始的 URL（锚）

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

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

4. href：设置或返回完整的 URL

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

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

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

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

Location对象方法

1. assign：加载新的文档

2. reload：重新加载当前文档

3. replace：用新的文档替换当前文档