JavaScript 的 API 是浏览器或运行环境提供的预定义函数、对象和规则,用于与外部系统交互;常见类型包括 DOM、Fetch、Date、localStorage 和 Geolocation API,均挂载于全局对象如 window 下。

JavaScript 的 API 不是某个具体的东西,而是指浏览器或运行环境提供的一套预定义的函数、对象和规则,让 JS 代码能与外部系统(比如浏览器功能、网络、设备等)交互。它不是你写的代码,而是你“用”的代码。
常见的 Web API 类型和用途
Web API 分很多类,比如操作页面的 DOM API、发网络请求的 Fetch API、处理时间的 Date API、存数据的 localStorage API、获取用户位置的 Geolocation API 等。它们都挂载在全局对象(如 window)下,可以直接调用。
如何调用 Fetch API 发起网络请求
Fetch 是现代 JS 中最常用的网络请求方式,用来从服务器获取或发送数据:
- 基本 GET 请求:fetch('https://jsonplaceholder.typicode.com/posts/1') 返回一个 Promise,用 .then() 或 async/await 处理响应
- 记得调用 .json() 方法解析响应体(其他格式如 .text()、.blob() 也行)
- 别忘了捕获错误:用 .catch() 或 try/catch,因为网络失败不会触发 reject(除非请求根本没发出去)
- POST 示例:fetch(url, { method: 'POST', headers: {'Content-Type': 'application/json'}, body: JSON.stringify(data) })
如何用 DOM API 操作网页内容
DOM API 让你能读写 HTML 元素:
立即学习“Java免费学习笔记(深入)”;
- 查元素:document.getElementById('myId')、document.querySelector('.item')
- 改内容:elem.textContent = '新文字' 或 elem.innerHTML = '加粗'
- 绑事件:btn.addEventListener('click', () => console.log('点了'))
- 动态创建:const div = document.createElement('div'),再用 appendChild() 加到页面
如何使用 localStorage 存本地数据
适合存小量字符串数据(比如用户偏好、登录状态),关闭浏览器也不丢:
- 存:localStorage.setItem('theme', 'dark')
- 取:localStorage.getItem('theme') → 返回 'dark' 或 null
- 删:localStorage.removeItem('theme') 或 localStorage.clear() 清空全部
- 注意:只能存字符串,对象要先 JSON.stringify(),读出来再 JSON.parse()
基本上就这些。API 调用不复杂但容易忽略细节,比如异步处理、错误捕获、数据格式转换。多练几次,自然就熟了。











