客户端 Web API

在为网站或应用编写客户端 JavaScript 时，你很快就会遇到应用编程接口 (API)。API 是用于操作网站运行的浏览器和操作系统的不同方面，或操作来自其他网站或服务的数据的编程功能。在本模块中，我们将探讨什么是 API，以及如何使用你在开发工作中经常遇到的一些最常见的 API。

¥When writing client-side JavaScript for websites or applications, you will quickly encounter Application Programming Interfaces (APIs). APIs are programming features for manipulating different aspects of the browser and operating system the site is running on, or manipulating data from other websites or services. In this module, we will explore what APIs are, and how to use some of the most common APIs you'll come across often in your development work.

先决条件

¥Prerequisites

为了充分利用本模块，你应该已经完成了本系列中前面的 JavaScript 模块（第一步、架构模块和 JavaScript 对象）。这些模块通常涉及简单的 API 使用，因为如果没有它们，通常很难编写客户端 JavaScript 示例。在本教程中，我们假设你了解核心 JavaScript 语言，并且我们将更详细地探讨常见的 Web API。

¥To get the most out of this module, you should have worked your way through the previous JavaScript modules in the series (First steps, Building blocks, and JavaScript objects). Those modules typically involve simple API usage, as it is often difficult to write client-side JavaScript examples without them. For this tutorial, we will assume that you are knowledgeable about the core JavaScript language, and we will explore common Web APIs in a bit more detail.

HTML 和 CSS 的基本知识也很有用。

¥Basic knowledge of HTML and CSS would also be useful.

注意：如果你使用的设备无法创建自己的文件，你可以尝试在线编码程序（例如 JSBin 或 Glitch）中的（大部分）代码示例。

¥Note: If you are working on a device where you don't have the ability to create your own files, you could try out (most of) the code examples in an online coding program such as JSBin or Glitch.

指南

¥Guides

Web API 简介: 首先，我们将从高层次上了解 API 开始 — 它们是什么、它们如何工作、如何在代码中使用它们以及它们的结构如何？我们还将了解 API 的不同主要类别以及它们的用途。
处理文档: 在编写网页和应用时，你最常见的事情之一就是以某种方式操作 Web 文档。这通常通过使用文档对象模型 (DOM) 来完成，这是一组用于控制大量使用 Document 对象的 HTML 和样式信息的 API。在本文中，我们将详细了解如何使用 DOM，以及一些其他有趣的 API，它们可以以有趣的方式改变你的环境。
从服务器获取数据: 现代网站和应用中的另一个非常常见的任务是从服务器检索单个数据项以更新网页的各个部分，而无需加载全新的页面。这个看似很小的细节却对网站的性能和行为产生了巨大的影响。在本文中，我们将解释这个概念，并研究使其成为可能的技术，例如 XMLHttpRequest 和获取 API。
第三方 API: 到目前为止，我们介绍的 API 都内置于浏览器中，但并非所有 API 都是内置的。许多大型网站和服务（例如 Google 地图、Facebook、PayPal 等）都提供 API，允许开发者使用他们的数据或服务（例如，在你的网站上显示自定义 Google 地图，或使用 Facebook 登录来登录你的用户）。本文着眼于浏览器 API 和第 3 方 API 之间的差异，并展示后者的一些典型用法。
绘制图形: 该浏览器包含一些非常强大的图形编程工具，从可扩展矢量图形 (SVG) 语言到用于在 HTML <canvas> 元素上绘图的 API（请参阅画布 API 和 WebGL）。本文介绍了 Canvas API 以及更多资源，以便你了解更多信息。
视频和音频 API: HTML 附带了用于在文档中嵌入富媒体的元素（<video> 和 <audio>），而这些元素又附带了自己的 API，用于控制播放、搜索等。本文将向你展示如何执行常见任务，例如创建自定义播放控件。
客户端存储: 现代网络浏览器具有多种不同的技术，允许你存储与网站相关的数据并在必要时检索它，从而允许你长期保留数据、离线保存网站等等。本文解释了它们如何工作的基础知识。