客户端 Web API

当你为网页或应用编写客户端 JavaScript 时，很快会遇到应用程序接口（API）。API 是用于操控网站所基于的浏览器与操作系统不同方面，或处理来自其他网站或服务端数据的编程特性。在本单元中，我们将一起探索什么是 API 以及如何使用开发中常见的各种 API。

预备知识

要深入理解本单元内容，你需要掌握之前章节的知识，包括JavaScript 基础、创建 JavaScript 代码块和JavaScript 对象介绍。这些章节涉及了许多简单 API 的使用，没有这些知识，我们很难完成实际项目。本教程假设你已经掌握了 JavaScript 核心知识，然后我们将更深入地探索常见的 Web API。

了解HTML和CSS基础知识，也将有助于理解本单元内容。

备注：如果你使用的设备无法创建自己的文件，可以尝试使用在线网页编辑器如JSBin或Glitch来编辑代码示例。

指南

Web API 简介

首先，我们将从更高层面了解 API：它们是什么，如何工作，如何在代码中使用，以及它们的构成方式。我们还将探讨不同的主要 API 类别及其用途。

操作文档

编写网页和应用时，最常见的任务之一就是操作网页文档。这通常通过文档对象模型（DOM）完成——DOM 是一组用于控制 HTML 和样式信息的 API，大量使用Document对象。本文将详细讨论如何使用 DOM 及其他有趣的 API，它们可以以有趣的方式改变你的环境。

从服务器获取数据

在现代网页和应用中，另一个常见任务是与服务器进行数据交互而不刷新整个页面。这看似简单，但对网页的展示和交互至关重要。本文将阐述这一概念，并介绍实现此功能的技术，如XMLHttpRequest和Fetch API。

第三方 API

目前我们讨论的 API 都是浏览器内置的，但情况并非总是如此。许多大型网站如 Google Maps、Facebook、PayPal 等提供 API，让开发者使用其数据（如在博客中展示分享的 Twitter 内容）或服务（如在网页中显示自定义 Google 地图或集成 Facebook 登录功能）。本文介绍了浏览器 API 和第三方 API 的区别以及一些最新典型应用。

绘制图形

浏览器包含多种强大的图形编程工具，从可缩放矢量图形语言SVG到 HTML 绘制元素<canvas>（Canvas API和WebGL）。本文提供了 Canvas 简介及深入学习资源。

视频和音频 API

HTML5 可通过元素标签嵌入富媒体：<video>和<audio>。这些元素附带用于控制播放、搜索等功能的 API。本文展示了如何创建自定义播放控制等常见任务。

客户端存储

现代 Web 浏览器拥有多种技术，可让你存储与网站相关的数据并在需要时调用，实现长期保存数据、保存离线网站等功能。本文解释了这些功能的基本原理。