前言

JavaScript BOM(浏览器对象模型)提供了一组用于与浏览器进行交互的 API。用于实现基于浏览器的用户交互功能。以下就是对于常用API实际的作用说明。

一、window API

  • window.alert(message): 在浏览器中显示一个警告框,包含指定的消息。
  • window.prompt(message, defaultText): 在浏览器中显示一个提示框,接受用户的输入。
  • window.confirm(message): 在浏览器中显示一个确认框,询问用户是否确认。
  • window.open(url, target, features): 打开一个新窗口或标签页,并加载指定的 URL。
  • window.close(): 关闭当前窗口或标签页。
  • window.location: 获取或设置当前窗口的 URL 信息。
  • window.document: 获取当前窗口中的文档对象。
  • window.navigator: 提供关于浏览器和操作系统的信息。
  • window.history: 提供浏览器历史记录的访问和操作。
  • window.setTimeout(function, delay): 在指定的延迟时间后执行函数。
  • window.setInterval(function, delay): 每隔一定的时间间隔重复执行函数。
  • window.clearTimeout(timeoutID): 清除由 setTimeout() 创建的定时器。
  • window.clearInterval(intervalID): 清除由 setInterval() 创建的定时器。

二、History API

1、属性

  • history.length  该整数表示会话历史中元素的数目,包括当前加载的页。。
  • history.state 返回在 history 栈顶的 任意 值的拷贝。通过这种方式可以查看 state 值。
  • history.scrollRestoration 允许在历史导航上显式地设置默认滚动恢复行为。此属性可以是自动的(auto)或者手动的(manual)。

2、方法

  • history.back() 导航到浏览器历史记录中的上一页。
  • history.forward() 导航到浏览器历史记录中的下一页。
  • history.go() 导航到浏览器历史记录中的相对位置。
  • history.pushState() 按指定的名称和 URL(如果提供该参数)将数据 push 进会话历史栈,数据被 DOM 进行不透明处理;你可以指定任何可以被序列化的 javascript 对象。
  • history.replaceState() 按指定的数据、名称和 URL(如果提供该参数),更新 history 栈上最新的条目。这个数据被 DOM 进行了不透明处理。你可以指定任何可以被序列化的 javascript 对象。

三、Location API 

  • location.href: 获取或设置当前页面的 URL。
  • location.hostname: 获取当前页面的主机名。
  • location.pathname: 获取当前页面的路径名。
  • location.protocol: 获取当前页面的协议。

四、Navigator API

  • navigator.userAgent: 获取浏览器的用户代理字符串。
  • navigator.cookieEnabled: 检测浏览器是否启用了 Cookie。
  • navigator.geolocation: 提供地理位置信息的访问。
  • navigator.language: 获取用户的首选语言。
  • navigator.onLine: 检测浏览器是否在线。
  • navigator.userAgent: 获取浏览器的用户代理字符串。

结语

这些 API 提供了许多与浏览器交互和控制的能力,可以实现页面的导航、弹窗、定时器等功能。