recursal/MDN huggingface dataset:
Notifications API
=================

**备注：** 此特性在 Web Worker 中可用

**安全上下文:** 此项功能仅在一些支持的浏览器的安全上下文（HTTPS）中可用。

**Notifications API** 允许网页控制向最终用户显示系统通知——这些都在顶级浏览上下文视口之外，因此即使用户已经切换标签页或移动到不同的应用程序，也可以显示。该 API 被设计成与不同平台上的现有通知系统兼容。

概念和用法
-----

在支持该接口的平台上，显示一个系统通知通常涉及两件事。首先，用户需要为当前来源授予权限以显示系统通知，这通常在应用或站点初始化时，使用 `Notification.requestPermission()` 方法来完成。这应该通过响应用户交互来完成，例如单击按钮，例如：


```js
btn.addEventListener("click", () => {
  let promise = Notification.requestPermission();
  // 等待授权
});
```


这不仅是最佳实践——你不应该向用户发送他们不同意的通知——并且未来的浏览器将明确禁止未响应用户交互而触发的通知。例如，Firefox 从 72 版本开始就已经这样做了。

这将产生一个请求对话框，内容如下：

![一个对话框，要求用户允许来自该源的通知。有一些选项可以禁止或允许通知](/zh-CN/docs/Web/API/Notifications_API/screen_shot_2019-12-11_at_9.59.14_am.png)

从这里，用户可以选择允许来自此来源的通知或阻止来自此来源的通知。一旦做出选择，该设置通常将持续用于当前会话。

**备注：** 从 Firefox 44 开始，通知（Notification）和推送（Push）的权限已合并。如果为通知授予权限，推送也将启用。

接下来，使用 `Notification()` 构造函数创建一个新通知。这个函数必须传递一个标题参数，并且可以选择传递一个选项对象来指定选项，例如文本方向、正文、要显示的图标、要播放的通知声音等等。

此外，Notifications API 规范对 ServiceWorker API (en-US) 指定了多个添加，以允许 Service Worker 发送通知。

**备注：** 想了解怎么在你的应用里使用通知接口，请阅读使用 Notifications API。

Notifications 接口
----------------

`Notification`

定义的通知对象。

### Service worker 附加内容

`ServiceWorkerRegistration` (en-US)

该对象包含 `ServiceWorkerRegistration.showNotification()` (en-US) 和 `ServiceWorkerRegistration.getNotifications()` (en-US) 方法，用于控制通知的显示。

`ServiceWorkerGlobalScope`

该对象包含 `onnotificationclick` (en-US) 事件处理器，用于通知被点击的时候触发自定义函数。

`NotificationEvent`

该对象是功能明确的事件对象，表示一个被触发的通知事件，继承自 `ExtendableEvent`。

规范
--

| Specification |
| --- |
| Notifications API Standard  |

浏览器兼容性
------

### api.Notification

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

### api.ServiceWorkerRegistration.showNotification

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

### api.ServiceWorkerRegistration.getNotifications

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

参见
--

* 使用 Notifications API
Web Crypto API
==============

**Web Crypto API** 为脚本提供了一套关于密码学原语的接口，以便用于构建需要使用加密的系统。

**备注：** 此特性在 Web Worker 中可用

**安全上下文:** 此项功能仅在一些支持的浏览器的安全上下文（HTTPS）中可用。

**警告：** 此 API 提供了许多底层密码学原语。滥用它们很容易陷入微妙的陷阱中。

即使你正确地运用了基础加密方法，也很难设计一套正确的安全密钥管理及整体安全设计方案，这些往往是安全专家所做的事情。

错误的安全系统设计和实现会使系统的安全性完全失效。

你可以学习并进行实验，但我们并不能保证这些内容的安全性，最好有熟悉该领域的人对你的相关工作进行彻底的审查以保证其安全性。如果你要学习安全系统的设计和部署，可以学习 Crypto 101 课程。

接口
--

有些浏览器实现了叫作 `Crypto` 的接口，但是它缺乏良好的定义，或在密码学上是不健全的。为了避免混乱，这个接口的方法和属性已经被实现 Web Crypto API 的浏览器所移除，并且所有的 Web Crypto API 方法都可以在新的接口中使用：`SubtleCrypto`。`Crypto.subtle` 属性可以获取到一个实现了新接口的对象。

规范
--

| Specification |
| --- |
| Web Cryptography API # crypto-interface |

浏览器兼容性
------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
Worker
======

Worker 接口是 Web Workers API 的一部分，指的是一种可由脚本创建的后台任务，任务执行中可以向其创建者收发信息。要创建一个 Worker，只须调用 `Worker(URL)` 构造函数，函数参数 `URL` 为指定的脚本。

Worker 也可以创建新的 Worker，当然，所有 Worker 必须与其创建者同源（注意：Blink暂时不支持嵌套 Worker）。

需要注意的是，不是所有函数和构造函数 (或者说…类) 都可以在 Worker 中使用。具体参考页面 Worker 所支持的函数和类。Worker 可以使用 `XMLHttpRequest` 发送请求，但是请求的 `responseXML` 与 `channel` 两个属性值始终返回 `null` （`fetch` 仍可正常使用，没有类似的限制）。

**备注：** 如果你要在火狐浏览器的扩展使用 Worker 访问 js-ctypes，应使用 `ChromeWorker` 对象来替代。(译者注：这里没有看懂，希望有人能驳正，或添加说明)

构造函数
----

`Worker()`

创建一个专用 Web worker，它只执行 URL 指定的脚本。使用 Blob URL 作为参数亦可。

属性
--

*继承*父对象\*`EventTarget` 的属性，以及实现对象 `AbstractWorker` (en-US)的属性。\*

### *事件句柄*

`AbstractWorker.onerror` (en-US)

当`ErrorEvent` 类型的事件冒泡到 worker 时，事件监听函数 `EventListener` 被调用。它继承于 `AbstractWorker` (en-US).

`Worker.onmessage`

当`MessageEvent`类型的事件冒泡到 worker 时，事件监听函数 `EventListener` 被调用。例如，一个消息通过 `DedicatedWorkerGlobalScope.postMessage` (en-US)，从执行者发送到父页面对象，消息保存在事件对象的 `data` (en-US) 属性中。

`Worker.onmessageerror`

当`messageerror` (en-US) 类型的事件发生时，对应的事件处理器代码被调用。

方法
--

*继承*父对象\*`EventTarget` 的方法，以及实现对象 `AbstractWorker` (en-US)的方法。\*

`Worker.postMessage()`

发送一条消息到最近的外层对象，消息可由任何 JavaScript 对象组成。

`Worker.terminate()`

立即终止 worker。该方法不会给 worker 留下任何完成操作的机会；就是简单的立即停止。Service Woker 不支持这个方法。

示例
--

下面的代码通过构造函数 `Worker()` 创建了一个 `Worker` 对象。


```js
var myWorker = new Worker("worker.js");
var first = document.querySelector("#number1");
var second = document.querySelector("#number2");

first.onchange = function () {
  myWorker.postMessage([first.value, second.value]);
  console.log("Message posted to worker");
};
```


完整的示例，请查阅 Basic dedicated worker example (run dedicated worker).

规范
--

| Specification |
| --- |
| HTML Standard # dedicated-workers-and-the-worker-interface |

浏览器兼容性
------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

不同类型的 worker 兼容度不一致，详细参考具体定义的页面。

### 跨域行为的错误事件

浏览器的早期版本中，加载跨域的执行者脚本导致 `SecurityError`事件。根据规范的变更，而新版本的浏览器只有`error`事件发生

参见
--

* 使用 Web Worker
* Web Worker 可用的函数和类
* 其他类型的 worker：`SharedWorker` 和 ServiceWorker.
* `OffscreenCanvas` 接口
SourceBufferList
================

**实验性:** **这是一项实验性技术**  
在将其用于生产之前，请仔细检查浏览器兼容性表格。

**`SourceBufferList`** 接口表示多个 `SourceBuffer` 对象的简单容器列表。

使用 `MediaSource.sourceBuffers` 属性可以检索附加到特定 `MediaSource` 的 `SourceBuffer` 的源缓冲列表。

使用数组操作符 `[]` 可以访问到各个源缓冲区。

EventTarget

SourceBufferList属性
--

`SourceBufferList.length` 只读 

返回列表中 `SourceBuffer` 对象的数量。

方法
--

*从它的父接口 `EventTarget` 继承方法。*

事件
--

`addsourcebuffer`

当一个 `SourceBuffer` 增加到列表时触发。

`removesourcebuffer`

当一个 `SourceBuffer` 从列表移除时触发。

示例
--

这个示例展示了如何访问连接到一个已经在播放的 `HTMLVideoElement` 其内部的 `MediaSource` 的活动源缓冲区。


```js
// Video is an already playing video using a MediaSource srcObject
const video = document.querySelector("video");
const mediaSource = video.srcObject;
const sourceBufferList = mediaSource.activeSourceBuffers;
for (const sourceBuffer of sourceBufferList) {
  // Do something with each SourceBuffer, such as call abort()
  sourceBuffer.abort();
}
```

规范
--

| Specification |
| --- |
| Media Source Extensions™ # sourcebufferlist |

浏览器兼容性
------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

参见
--

* `MediaSource`
* `SourceBuffer`
WritableStreamDefaultController
===============================

Stream API 中的 **`WritableStreamDefaultController`** 接口表示一个允许控制 `WritableStream` 状态的控制器。当构造 `WritableStream` 时，会为底层的接收器提供一个相应的 `WritableStreamDefaultController` 实例以进行操作。

构造函数
----

无。`WritableStreamDefaultController` 实例会在构造 `WritableStream` 时被自动创建。

实例属性
----

`WritableStreamDefaultController.signal` (en-US) 只读 

返回与 controller 相关联的 `AbortSignal`。

实例方法
----

`WritableStreamDefaultController.error()`

导致未来任何与关联的流的交互都会出错。

示例
--


```js
const writableStream = new WritableStream({
  start(controller) {
    // do stuff with controller
    // error stream if necessary
    controller.error('My stream is broken');
  },
  write(chunk, controller) {
    ...
  },
  close(controller) {
    ...
  },
  abort(err) {
    ...
  }
});
```

规范
--

| Specification |
| --- |
| Streams Standard # ws-default-controller-class |

浏览器兼容性
------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
RTCStatsReport
==============

**`RTCStatsReport`** 接口提供了通过调用 `RTCPeerConnection.getStats()` (en-US)、`RTCRtpReceiver.getStats()` (en-US) 和 `RTCRtpSender.getStats()` (en-US) 这三个方法之一所获得的统计报告。

该统计报告包含统计类别字符串名称到包含相应统计数据的对象的映射。

在 `RTCPeerConnection` 上调用 `getStats()` 可以让你指定是否希望获取连接上的出站、入站或是所有流的统计信息。`getStats()` 的 `RTCRtpReceiver` (en-US) 和 `RTCRtpSender` (en-US) 版本仅返回你调用它们的传入或传出流的统计信息。

统计对象
----

对于每种统计信息类别，都有一个字典，字典的属性提供相关信息。

### 所有统计类别共有的属性

所有 WebRTC 统计对象都基于 `RTCStats` 字典，该字典提供了最基本的信息：时间戳、统计类型字符串和唯一标识数据源的 ID。

### 统计类别

`type` 值给出了对象所代表的统计类别的名称。以及如何查找你需要的特定数据的类型。

规范
--

| Specification |
| --- |
| WebRTC: Real-Time Communication in Browsers # rtcstatsreport-object |

浏览器兼容性
------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

参见
--

* WebRTC API
* `RTCPeerConnection`
* `RTCPeerConnection.getStats()` (en-US)、`RTCRtpReceiver.getStats()` (en-US) 和 `RTCRtpSender.getStats()` (en-US)
OscillatorNode
==============

**`OscillatorNode`** 接口表示一个振荡器，它产生一个周期的波形信号（如正弦波）。它是一个 `AudioScheduledSourceNode` 音频处理模块，这个模块会生成一个指定频率的波形信号（即一个固定的音调）

一个 `OscillatorNode` 对象是通过 `AudioContext.createOscillator()` (en-US) 方法创建的。它总是有一个输出，但没有输入。它的基础属性（定义见 `AudioNode` ）默认如下：

|  |  |
| --- | --- |
| Number of inputs | `0` |
| Number of outputs | `1` |
| Channel count mode | `max` |
| Channel count | `2` (not used in the default count mode) |
| Channel interpretation | `speakers` |

构造函数
----

`OscillatorNode()`

创建一个 OscillatorNode 对象的示例，为 node属性提供可选的一个定义默认值的对象。如果默认值可接受，你可以简单地调用`AudioContext.createOscillator()` (en-US)工厂方法。

属性
--

*继承自父类* *`AudioScheduledSourceNode`，并添加下列属性：*

`OscillatorNode.frequency`

一个 a-rate `AudioParam` 对象的属性代表了振动的频率（单位为赫兹 hertz） (虽然返回的`AudioParam 是只读的，但是它所表示的值是可以修改的`)。默认值是 440 Hz (基本的中 A 音高).

`OscillatorNode.detune`

一个 a-rate `AudioParam` 对象的属性代表振动的音高微调（单位是 cent 音分） (虽然返回的`AudioParam 是只读的，但是它所表示的值是可以修改的`).。默认值是 0。

`OscillatorNode.type` (en-US)

一个字符串，决定 `OscillatorNode 播放的声音的周期波形`; 它的值可以是基础值中的一个或者用户使用 `PeriodicWave`。不同的波形可以产生不同的声调。基础值有 `"sine"`、`"square"`、`"sawtooth"`、`"triangle"` 和 `"custom"`。默认值是 `"sine"`。

方法
--

*继承自父级，* *`AudioScheduledSourceNode`*, 自有方法如下：

`OscillatorNode.setPeriodicWave()`

设置一个 `PeriodicWave` ,它描述了一个周期的波形常常替代标准波形之一; 调用这个方法来设置用户自定义的波形。它取代了已经废弃了的 `OscillatorNode.setWaveTable()` 方法。

示例
--

下面示例展示了 `AudioContext` 的基本使用 来创建一个 oscillator 节点 并使用它来播放音乐。这是已经在运行的例子，可以看这里 Violent Theremin demo (see app.js 是相关代码).


```js
// create web audio api context
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();

// create Oscillator node
var oscillator = audioCtx.createOscillator();

oscillator.type = "square";
oscillator.frequency.value = 440; // value in hertz
oscillator.connect(audioCtx.destination);
oscillator.start();
```

规范
--

| Specification |
| --- |
| Web Audio API # OscillatorNode |

浏览器兼容性
------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* Using the Web Audio API (en-US)
FontFace
========

**实验性:** **这是一项实验性技术**  
在将其用于生产之前，请仔细检查浏览器兼容性表格。

**`FontFace`** 接口表示一个可用的字体。它允许你控制字体的源文件，作为外部资源的 URL 或缓冲区; 它还允许你控制字体的加载时间和字体当前的状态。

Constructor
-----------

`FontFace()` (en-US)

使用 URL 指向的外部资源或`ArrayBuffer`构造并返回一个新的 `FontFace` 对象。

Properties
----------

*这个接口不继承任何属性。*

`FontFace.family` (en-US)

这是不是一个`DOMString` ？是的话将表示该字体的 *family* 属性，相当于 `family` 。

`FontFace.style` (en-US)

这是不是一个 `DOMString` ？是的话将表示该字体的 *style* 属性，相当于 `style` 。

`FontFace.weight` (en-US)

这是不是一个 `DOMString` ？是的话将表示该字体的 *weight* 属性，相当于 `weight`。

`FontFace.stretch` (en-US)

这是不是一个 `DOMString` ？是的话将表示该字体的 *stretches* 属性，相当于 `stretch` 。

`FontFace.unicodeRange` (en-US)

这是不是一个 `DOMString` ？是的话将表示该字体涵盖的 *range of code*（字符编码的范围），相当于 `unicode-range` (en-US) 。

`FontFace.variant` (en-US)

这是不是一个 `DOMString` ？是的话将表示该字体的 *variant* 属性，相当于 `range` 。

`FontFace.featureSettings` (en-US)

这是不是一个 `DOMString` ？是的话将表示该字体的 *features* 属性，相当于 `feature-settings` 。

`FontFace.status` (en-US) 只读 

返回一个表示字体当前状态的可枚举值，它可能是下列之一：`"unloaded"`、`"loading"`、`"loaded"`、`"error"`。

`FontFace.loaded` (en-US) 只读 

当字体完全加载或加载失败时返回该 `FontFace` 的 `Promise` (en-US)。

方法
--

*这个接口不继承任何方法。*

`FontFace.load()` (en-US)

加载该字体，返回该字体完全加载或加载失败时的 `Promise` (en-US)。

规范
--

| Specification |
| --- |
| CSS Font Loading Module Level 3 # fontface-interface |

浏览器兼容性
------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
CSS 对象模型
========

**CSS 对象模型**是一组允许用 JavaScript 操纵 CSS 的 API。它很像 DOM，但针对的是 CSS 而不是 HTML。它允许用户动态地读取和修改 CSS 样式。

CSS 的值是没有类型的，也就是使用 `String` 对象来表示。

参考
--

* `AnimationEvent` (en-US)
* `CaretPosition`
* `CSS`
* `CSSCharsetRule`
* `CSSConditionRule`
* `CSSCounterStyleRule` (en-US)
* `CSSFontFaceRule` (en-US)
* `CSSFontFeatureValuesMap`
* `CSSFontFeatureValuesRule` (en-US)
* `CSSGroupingRule`
* `CSSImportRule` (en-US)
* `CSSKeyframeRule` (en-US)
* `CSSKeyframesRule` (en-US)
* `CSSMarginRule`
* `CSSMediaRule`
* `CSSNamespaceRule` (en-US)
* `CSSPageRule`
* `CSSRule`
* `CSSRuleList`
* `CSSStyleDeclaration`
* `CSSStyleSheet`
* `CSSStyleRule`
* `CSSSupportsRule`
* `CSSVariablesMap`
* `CSSViewportRule`
* `FontFace`
* `FontFaceSet`
* `FontFaceSetLoadEvent` (en-US)
* `GetStyleUtils`
* `MediaList`
* `MediaQueryList`
* `MediaQueryListEvent`
* `Screen`
* `StyleSheet`
* `StyleSheetList`
* `TransitionEvent`

CSSOM 相关规范也扩展了其他几个接口：`Document`、`Window`、`Element`、`HTMLElement`、`HTMLImageElement`、`Range`、`MouseEvent` 和 `SVGElement`。

### CSS 类型化对象模型 
实验性

**实验性:** **这是一项实验性技术**  
在将其用于生产之前，请仔细检查浏览器兼容性表格。

* `CSSImageValue` (en-US) 
实验性
* `CSSKeywordValue` (en-US) 
实验性
* `CSSMathInvert` (en-US) 
实验性
* `CSSMathMax` (en-US) 
实验性
* `CSSMathMin` (en-US) 
实验性
* `CSSMathNegate` (en-US) 
实验性
* `CSSMathProduct` (en-US) 
实验性
* `CSSMathSum` 
实验性
* `CSSMathValue` (en-US) 
实验性
* `CSSMatrixComponent` (en-US) 
实验性
* `CSSNumericArray` (en-US) 
实验性
* `CSSNumericValue` (en-US) 
实验性
* `CSSPerspective` (en-US) 
实验性
* `CSSPositionValue` (en-US) 
实验性
* `CSSRotate` (en-US) 
实验性
* `CSSScale` (en-US) 
实验性
* `CSSSkew` (en-US) 
实验性
* `CSSSkewX` (en-US) 
实验性
* `CSSSkewY` (en-US) 
实验性
* `CSSStyleValue` (en-US) 
实验性
* `CSSTransformComponent` (en-US) 
实验性
* `CSSTransformValue` (en-US) 
实验性
* `CSSTranslate` (en-US) 
实验性
* `CSSUnitValue` (en-US) 
实验性
* `CSSUnparsedValue` (en-US) 
实验性
* `CSSVariableReferenceValue` (en-US) 
实验性
* `StylePropertyMap` 
实验性
* `StylePropertyMapReadOnly` (en-US) 
实验性
### 废弃的 CSSOM 接口 
已弃用

**已弃用:** 不再推荐使用该特性。虽然一些浏览器仍然支持它，但也许已从相关的 web 标准中移除，也许正准备移除或出于兼容性而保留。请尽量不要使用该特性，并更新现有的代码；参见本页面底部的兼容性表格以指导你作出决定。请注意，该特性随时可能无法正常工作。

* `CSSPrimitiveValue` (en-US) 
已弃用
* `CSSValue` 
已弃用
* `CSSValueList` 
已弃用
教程
--

* 决定元素的维度（这篇文档可能有点过时，因为它是在 DHTML/Ajax 时代写的）。
* 管理屏幕方向 (en-US)
规范
--

| Specification |
| --- |
| CSS Object Model (CSSOM)  |
| CSSOM View Module  |
| CSS Typed OM Level 1  |

浏览器兼容性
------

所有这些功能都是多年来一点一点地添加到不同的浏览器中的：这是一个相当复杂的过程，不能用一个简单的表格来概括。请参考具体的接口，了解其可用性。

参见
--

* 文档对象模型（DOM）
* Houdini API
Web Storage API
===============

**Web Storage API** 提供了浏览器可以存储键/值对的机制，其方式比使用 cookie 更直观。

Web Storage 概念和用法
-----------------

Web Storage 包含如下两种机制：

* `sessionStorage` 为每一个给定的源（origin）维持一个独立的存储区域，该存储区域在页面会话期间可用（即只要浏览器处于打开状态，包括页面重新加载和恢复）。
    + 仅为会话存储数据，这意味着数据将一直存储到浏览器（或选项卡）关闭。
    + 数据永远不会被传输到服务器。
    + 存储限额大于 cookie（最大 5MB）。
* `localStorage` 做同样的事情，但即使浏览器关闭并重新打开也仍然存在。
    + 存储的数据没有过期日期，只能通过 JavaScript、清除浏览器缓存或本地存储的数据来清除。
    + 存储限额是两者之间的最大值。

这两种机制是通过 `Window.sessionStorage` 和 `Window.localStorage` 属性使用（更确切的说，在支持的浏览器中 `Window` 对象实现了 `WindowLocalStorage` 和 `WindowSessionStorage` 对象并挂在其 `localStorage` 和 `sessionStorage` 属性下）——调用其中任一对象会创建 `Storage` 对象，通过 `Storage` 对象，可以设置、获取和移除数据项。对于每个源 `sessionStorage` 和 `localStorage` 使用不同的 Storage 对象——独立运行和控制。

**备注：** 在 Firefox 中，当浏览器崩溃或重新启动时，为了避免过度使用 Web storage 导致的内存问题，每个源的存储大小将限制在 10M。有关详细信息，请参阅存储配额和清理标准。

**备注：** 若用户禁用第三方 cookie，那么将不允许来自第三方 IFrame 对 Web Storage 的访问。

Web Storage 接口
--------------

`Storage`

允许你在一个特定域中设置、检索和删除数据和储存类型（session 或 local）。

`Window`

Web Storage API 继承于 `Window` 对象，并提供两个新属性——`Window.sessionStorage` 和 `Window.localStorage`——分别地提供对当前域的会话和本地 `Storage` 对象的访问。以及当存储区域改变时触发的 `storage` 事件处理器（例如，存储新的项）。

`StorageEvent`

当一个存储区域发生变化时，在文档的 `Window` 对象上触发 `storage` 事件。

示例
--

为了阐述一些典型的 web storage 的用法，我们创了一个简单的例子，想象上地称为 Web Storage 演示。着陆页提供了可以用来自定义颜色、字体和装饰图片的控件。当你选择不同的选项，页面会被立即更新；此外，你的选择将被储存到 `localStorage` 中，以便当你离开该页面，然后过些时候在重新加载它时，你的选择会被记住。

另外，我们还提供了一个事件输出页面——如果你在另一个标签页加载这个页面，然后在着陆页改变你的选择，你将看到在触发 `StorageEvent` 时输出更新后的存储信息。

规范
--

| Specification |
| --- |
| HTML Standard # dom-localstorage-dev |
| HTML Standard # dom-sessionstorage-dev |

浏览器兼容性
------

### api.Window.localStorage

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

### api.Window.sessionStorage

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

隐私浏览/隐身模式
---------

隐私窗口、隐身模式和类似名称的隐私浏览选项不会存储历史记录和 cookie 等数据。在隐身模式下，`localStorage` 被视为 `sessionStorage`。存储 API 仍然可用且功能齐全，但是当浏览器或浏览器选项卡关闭时，所有存储在隐私窗口中的数据都会被删除。

参见
--

* 使用 Web Storage API
* 浏览器存储限制和清理标准
AudioContext
============

`AudioContext`接口表示由链接在一起的音频模块构建的音频处理图，每个模块由一个`AudioNode`表示。音频上下文控制它包含的节点的创建和音频处理或解码的执行。在做任何其他操作之前，你需要创建一个`AudioContext`对象，因为所有事情都是在上下文中发生的。建议创建一个`AudioContext`对象并复用它，而不是每次初始化一个新的`AudioContext`对象，并且可以对多个不同的音频源和管道同时使用一个`AudioContext`对象。

EventTarget

BaseAudioContext

(en-US)

AudioContext构造函数
----

`AudioContext()`

创建并返回一个新的 `AudioContext` 对象。

属性
--

*也从其父接口继承属性，`BaseAudioContext` (en-US).*

`AudioContext.baseLatency` (en-US) 只读  
实验性

返回`AudioContext`将音频从`AudioDestinationNode`传递到音频子系统的处理延迟的秒数。

`AudioContext.outputLatency` (en-US) 只读  
实验性

返回对当前音频上下文的预估输出延迟。

方法
--

*也从其父接口继承方法 , `BaseAudioContext` (en-US).*

`AudioContext.close()`

关闭一个音频环境，释放任何正在使用系统资源的音频。

`AudioContext.createMediaElementSource()`

创建一个`MediaElementAudioSourceNode`接口来关联`HTMLMediaElement`. 这可以用来播放和处理来自`<video>`或`<audio>` 元素的音频。

`AudioContext.createMediaStreamSource()`

创建一个`MediaStreamAudioSourceNode`接口来关联可能来自本地计算机麦克风或其他来源的音频流`MediaStream`。

`AudioContext.createMediaStreamDestination()` (en-US)

创建一个`MediaStreamAudioDestinationNode` (en-US)接口来关联可能储存在本地或已发送至其他计算机的`MediaStream`音频。

`AudioContext.createMediaStreamTrackSource()` (en-US)

创建一个`MediaStreamTrackAudioSourceNode` (en-US)，它与一个`MediaStream`相关联，表示一个媒体流轨迹。

`AudioContext.getOutputTimestamp()` (en-US)

返回一个新的 AudioTimestamp 对象，该对象包含两个与当前音频上下文相关的音频时间戳。

`AudioContext.resume()`

恢复之前被暂停的音频上下文中的时间进程。

`AudioContext.suspend()`

暂停音频上下文中的时间进程，暂停音频硬件访问并减少进程中的 CPU/电池使用。

例子
--

简单声明：


```js
var audioCtx = new AudioContext();
```


跨浏览器的方式：
```

var AudioContext = window.AudioContext || window.webkitAudioContext;
var audioCtx = new AudioContext();

var oscillatorNode = audioCtx.createOscillator();
var gainNode = audioCtx.createGain();
var finish = audioCtx.destination;
// etc.
```

规范
--

| Specification |
| --- |
| Web Audio API # AudioContext |

浏览器兼容性
------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

参见
--

* 使用 Web Audio API (en-US)
* `OfflineAudioContext`
atob()
======

**`atob()`** 对经过 base-64 编码的字符串进行解码。你可以使用 `window.btoa()` 方法来编码一个可能在传输过程中出现问题的数据，并且在接受数据之后，使用 atob() 方法再将数据解码。例如：你可以编码、传输和解码操作各种字符，比如 0-31 的 ASCII 码值。

关于针对 Unicode 或者 UTF-8 的应用方面，请查看 this note at Base64 encoding and decoding (en-US) 和 `btoa()` 的备注。

语法
--
```

var decodedData = scope.atob(encodedData);
```

### 异常

如果传入字符串不是有效的 base64 字符串，比如其长度不是 4 的倍数，则抛出`DOMException`。

示例
--


```js
let encodedData = window.btoa("Hello, world"); // 编码
let decodedData = window.atob(encodedData); // 解码
```

规范
--

| Specification |
| --- |
| HTML Standard # dom-atob-dev |

浏览器兼容性
------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

参见
--

* Base64 encoding and decoding
* `data` URIs
* `btoa()`
* Components.utils.importGlobalProperties
MediaStreamEvent
================

**实验性:** **这是一项实验性技术**  
在将其用于生产之前，请仔细检查浏览器兼容性表格。

**`MediaStreamEvent`** 接口表示发生在 `MediaStream`中的事件。这种类型返回两个事件：`addstream` 和 `removestream` (en-US).

Properties
----------

*一个 `MediaStreamEvent` 作为一个 `Event`，该事件也实现了这些属性。*

`MediaStreamEvent.stream` (en-US) 只读 

包含了 `MediaStream` 以及相关的事件流。

Constructors
------------

`MediaStreamEvent()` (en-US)

返回一个新的 `MediaStreamEvent`. 它需要两个参数，第一个为 `DOMString` 代表事件的类型；第二个是一个 `MediaStream` 集合。

Methods
-------

*一个 `MediaStreamEvent` 作为一个 `Event`, 这个事件也实现了这些属性*. *没有特定的 *`MediaStreamEvent`* 方法。*

示例
--


```js
pc.onaddstream = function (ev) {
  alert(
    "A stream (id: '" + ev.stream.id + "') has been added to this connection.",
  );
};
```

浏览器兼容性
------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

参见
--

* WebRTC
* 它的常见目标：`RTCPeerConnection`。
AudioParamDescriptor
====================

The **`AudioParamDescriptor`** dictionary of the Web Audio API specifies properties for an `AudioParam` objects. It is used to create custom `AudioParam`s on an `AudioWorkletNode`. If the underlying `AudioWorkletProcessor` has a `parameterDescriptors` (en-US) static getter, then the returned array of objects based on this dictionary is used internally by `AudioWorkletNode` constructor to populate its `parameters` (en-US) property accordingly.

属性
--

`name`

The `DOMString` which represents the name of the `AudioParam`. Under this name the `AudioParam` will be available in the `parameters` (en-US) property of the node, and under this name the `AudioWorkletProcessor.process` (en-US) method will acquire the calculated values of this `AudioParam`.

`automationRate` 可选

Either `"a-rate"`, or `"k-rate"` string which represents an automation rate of this `AudioParam`. Defaults to `"a-rate"`.

`minValue` 可选

A `float` which represents minimum value of the `AudioParam`. Defaults to `-3.4028235e38`.

`maxValue` 可选

A `float` which represents maximum value of the `AudioParam`. Defaults to `3.4028235e38`.

`defaultValue` 可选

A `float` which represents initial value of the `AudioParam`. Defaults to `0`.

示例
--

下面的代码片段展示了自定义的 `AudioWorkletProcessor` 中的静态方法 `parameterDescriptors` (en-US) 返回该类型的描述符（这是 AudioWorkletNode.parameters (en-US) 中完整示例的一部分）。


```js
// white-noise-processor.js
class WhiteNoiseProcessor extends AudioWorkletProcessor {
  static get parameterDescriptors() {
    return [
      {
        name: "customGain",
        defaultValue: 1,
        minValue: 0,
        maxValue: 1,
        automationRate: "a-rate",
      },
    ];
  }

  // …
}
```

规范
--

#### No specification found

No specification data found for `api.AudioParamDescriptor`.  
Check for problems with this page or contribute a missing `spec_url` to mdn/browser-compat-data. Also make sure the specification is included in w3c/browser-specs.

浏览器兼容性
------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
FileSystemDirectoryEntry
========================

**非标准:** 该特性是非标准的，请尽量不要在生产环境中使用它！

文件和目录条目 API 的 **`FileSystemDirectoryEntry`** 接口表示文件系统中的目录。它提供了方法，使其能够访问和操作目录中的文件，以及访问目录中的条目。

**备注：** 由于这是个非标准的 API，它的规范当前并没有在标准进程中，重要的是要记住，并不是所有浏览器都实现了他，并且实现它的浏览器可能仅仅实现了一小部分。更多细节请查看 Browser compatibility 。

基本概念
----

你可以通过调用 `getDirectory()` (en-US) 创建新的目录。如果你打算创建子目录，按需创建每个子目录。如果你尝试使用完整路径创建目录，包含不存在的父目录，会返回错误。所以需要在创建父目录之后，递归添加新的路径来创建层次。

### 示例

下面的代码中，我们创建了一个叫做 "Documents" 的目录。


```js
// Taking care of the browser-specific prefixes.
window.requestFileSystem  = window.requestFileSystem || window.webkitRequestFileSystem;
window.directoryEntry = window.directoryEntry || window.webkitDirectoryEntry;

...

function onFs(fs){
  fs.root.getDirectory('Documents', {create:true}, function(directoryEntry){
    //directoryEntry.isFile === false
    //directoryEntry.isDirectory === true
    //directoryEntry.name === 'Documents'
    //directoryEntry.fullPath === '/Documents'

    }, onError);

  }

// Opening a file system with temporary storage
window.requestFileSystem(TEMPORARY, 1024\*1024 /\*1MB\*/, onFs, onError);
```

属性
--

这个接口没有自己的属性，但是从它的父接口 `FileSystemEntry` (en-US) 继承了属性。

方法
--

这个接口从它的父接口 `FileSystemEntry` (en-US) 继承了方法。

`createReader()` (en-US)

创建 `FileSystemDirectoryReader` (en-US) 对象，它可以用于服务目录中的条目。

`getDirectory()` (en-US)

返回 `FileSystemDirectoryEntry` 对象，表示位于给定路径的目录，相对于方法调用处的目录。

`getFile()` (en-US)

返回 `FileSystemFileEntry`对象，表示在目录层次中的一个文件，提供相对于方法调用处目录的路径。

### 废弃的方法

`removeRecursively()` (en-US)

删除目录和所有内容，包含子目录的内容。它已经从规范中移除。

规范
--

| Specification |
| --- |
| File and Directory Entries API # api-directoryentry |

这个 API 没有官方的 W3C 或者 WHATWG 规范。

浏览器兼容性
------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

另见
--

* 文件和目录条目 API
* 文件系统 API 简介
* `FileSystemDirectoryReader` (en-US)
* `FileSystemEntry` (en-US)
* `FileSystemFileEntry`