BOM（浏览器模型）

最新推荐文章于 2022-11-28 00:21:08 发布

gym21

最新推荐文章于 2022-11-28 00:21:08 发布

阅读量611

点赞数 1

分类专栏： javascript 前端文章标签：前端 javascript 服务器

本文链接：https://blog.csdn.net/gym21/article/details/125518868

版权

本文详细介绍了浏览器对象模型BOM，包括window对象的窗口关系与框架、位置、大小、打开新窗口方法，location对象的属性及刷新页面，navigator对象、screen对象和history对象的相关知识点，全面解析了浏览器窗口交互的对象。

摘要由CSDN通过智能技术生成

在这里插入图片描述

一、简介

BOM（Browser Object Model）即浏览器对象模型，它提供了独立于内容而与浏览器窗口进行交互的对象，其核心对象是window。
BOM 由一系列相关的对象构成，并且每个对象都提供了很多方法与属性。

浏览器对象模型
把【浏览器】当成一个【对象】来看待
BOM 的顶级对象是window
BOM 学习的是浏览器窗口交互的一些对象
BOM 是浏览器厂商在各自浏览器上定义的，兼容性比较差

二、window对象

2.1、窗口关系与框架

top对象：始终指向最高层的框架，即浏览器窗口，使用它可以确保在一个框架中正确地访问另一个框架。
parent对象：始终指向当前框架的直接上层框架，在某些情况下，parent 有可能等于 top；但在没有框架的情况下，parent 一定等于top（此时它们都等于 window）。
self对象：始终指向自身框架。

2.2、窗口的位置

screenLeft 和screenTop 属性：用于表示窗口相对于屏幕左侧和顶部的位置。
moveTo() 和 moveBy() ：移动窗口

window.moveTo(0,0); // 把窗口移动到左上角
window.moveBy(0, 100); // 把窗口向下移动 100 像素
window.moveTo(200, 300); // 把窗口移动到坐标位置(200, 300)
window.moveBy(-50, 0); // 把窗口向左移动 50 像素