js中浏览器对象模型(BOM)的基础知识

浏览器对象模型(BOM)

浏览器对象模型（BOM）是一种用于访问和控制浏览器窗口的技术，是一组JavaScript对象，可以用来操作浏览器的窗口，比如窗口的大小、位置、显示状态等。BOM可以帮助开发者创建更加强大的网页应用，比如拖拽、窗口管理、文件上传等。

BOM常用对象

BOM的常用对象主要包括window对象和navigator对象，它们可以用来访问浏览器窗口和浏览器的信息。

window对象

window对象是BOM中最重要的对象，它表示浏览器窗口，可以用来操作浏览器的窗口，比如获取窗口的大小、位置、显示状态等。

• 获取窗口的大小：

  var width = window.innerWidth;
  var height = window.innerHeight;

• 获取窗口的位置：

  var left = window.screenX;
  var top = window.screenY;

• 获取窗口的显示状态：

  var isFullScreen = window.fullScreen;

• 设置窗口的大小：

  window.resizeTo(width, height);

• 设置窗口的位置：

  window.moveTo(left, top);

• 设置窗口的显示状态：

  window.fullScreen = true;

navigator对象

navigator对象可以用来获取浏览器的相关信息，比如浏览器的名称、版本、引擎等。

• 获取浏览器的名称：

  var browserName = navigator.appName;

• 获取浏览器的版本：

  var version = navigator.appVersion;

• 获取浏览器的引擎：

  var engine = navigator.product;

• 获取浏览器的用户代理：

  var userAgent = navigator.userAgent;

BOM的其他对象

除了window对象和navigator对象外，BOM还包括history对象、screen对象、location对象等，它们可以用来访问浏览器的历史记录、屏幕信息和当前网页的URL等。

• 获取浏览器的历史记录：

  var length = history.length;

• 获取屏幕的宽度：

  var width = screen.width;

• 获取当前网页的URL：

  var url = location.href;

BOM的应用

BOM的应用范围非常广泛，比如可以用来拖拽、窗口管理、文件上传等。拖拽可以用window对象的moveTo()方法实现，窗口管理可以用window对象的resizeTo()方法实现，文件上传可以用navigator对象的userAgent方法实现，等等。