前端常用的环境 API 清单

JavaScript 本身语言提供了语法和内置对象，但浏览器和 Node.js 等 运行环境 会额外提供很多 API，让 JS 可以操作 DOM、定时器、网络请求等

一、定时器 API（浏览器 & Node.js 都有）

API	功能
setTimeout(fn, delay)	延迟一次执行函数
setInterval(fn, delay)	每隔指定时间重复执行函数
clearTimeout(id)	取消 setTimeout 定时器
clearInterval(id)	取消 setInterval 定时器

二、浏览器 DOM / BOM API（浏览器环境特有）

1、DOM（操作页面元素）

• document.querySelector() / querySelectorAll()：用 CSS 选择器查找元素

• document.getElementById() / getElementsByClassName()：按 id / class 查找

• element.classList.add/remove/toggle：操作类名

  class=“box active” 表示这个元素同时有两个类：box 和 active。
  在 JS 中，可以通过 classList 对象操作元素的类名，而不用手动拼接字符串。

• element.style.xxx：修改样式

• element.innerHTML / textContent：获取或设置内容

2、BOM（浏览器对象模型，操作浏览器本身）

• window.location：获取 / 设置 URL

• window.open()：打开新窗口

• window.alert(), confirm(), prompt()：弹框

• navigator：浏览器信息

• screen：屏幕信息

• history：浏览器历史记录

• localStorage / sessionStorage：本地存储

• fetch()：网络请求（现代浏览器 API）

三、Node.js 全局 API（Node.js 环境特有）

Node.js 在服务器生成数据或页面，浏览器负责显示和交互。

API	功能
setTimeout / setInterval	同浏览器定时器
console.log / console.error	输出到终端
process	Node.js 进程信息，环境变量，退出等
Buffer	操作二进制数据
require() / import	模块加载
__dirname, __filename	文件路径信息

四、事件相关 API

API	功能
element.addEventListener('click', fn)	给元素绑定事件
element.removeEventListener('click', fn)	移除事件
event.preventDefault()	阻止默认事件
event.stopPropagation()	阻止事件冒泡

事件从内层 button 冒泡到外层 div。

五、现代网络 / 数据 API（浏览器）

API	功能
fetch(url, options)	发起 HTTP 请求
WebSocket	实时双向通信
XMLHttpRequest	传统 AJAX 请求
Promise / async/await	异步编程

六、常用工具 API

API	功能
JSON.parse() / JSON.stringify()	JSON 转换
Math 对象	数学函数，如 Math.random()、Math.floor()
Date 对象	获取时间和日期
encodeURIComponent() / decodeURIComponent()	URL 编码解码

七、总结

• 语言本身提供：Array、Object、String、Number、Math、Date、JSON、Promise 等

• 浏览器提供：DOM、BOM、事件、fetch、WebSocket 等

• Node.js 提供：文件、网络、进程、Buffer 等