recursal/MDN huggingface dataset:
MediaQueryList
==============

一个 `MediaQueryList` 对象在一个 `document` 上维持着一系列的媒体查询 (en-US)，并负责处理当媒体查询在其 document 上发生变化时向监听器进行通知的发送。

如果你需要以编程方式来检测一个 document 上的媒体查询的值的变化，这个 `MediaQueryList` 对象使得通过观察其 document 而检测它的媒体查询的值的变化成为可能，而不是周期性地对这些媒体查询的值进行检查。

方法概述
----
```

void addListener(MediaQueryListListener listener);
void removeListener(MediaQueryListListener listener);
```

实例属性
----

*`MediaQueryList` 接口从它的父接口 `EventTarget` 继承了属性。*

`matches` 只读 

一个布尔值，如果当前 `document` 与媒体查询列表相匹配，则返回 `true`，否则返回 `false`。

`media` (en-US) 只读 

代表序列化的媒体查询的字符串。

方法
--

### addListener()

在媒体查询列表上增加一个新的监听器，如果列表中已经存在了这个指定的监听器，这个方法将失去作用。
```

void addListener(
  MediaQueryListListener listener
);
```


#### 参数 ( 针对 addListener 方法)

`listener`

当其媒体查询的求值结果发生变化时，该 `MediaQueryListListener` (en-US) 对象将会被调用。

### removeListener()

从媒体查询列表中移除一个监听器，如果列表中不存在这个指定的监听器，则这个方法将失去作用。
```

void removeListener(
  MediaQueryListListener listener
);
```


#### 参数 (针对 removeListener 方法)

`listener`

该 `MediaQueryListListener` (en-US)对象将停止访问媒体查询的求值结果发生的变化。

规范
--

| Specification |
| --- |
| CSSOM View Module # the-mediaquerylist-interface |

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

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

参见
--

* CSS 媒体查询 (en-US)
* 通过代码使用媒体查询 (en-US)
* `window.matchMedia()`
* `MediaQueryListListener` (en-US)
IntersectionObserverEntry
=========================

**`IntersectionObserverEntry 接口`** (从属于 Intersection Observer API ) 描述了目标元素与其根元素容器在某一特定过渡时刻的交叉状态。`IntersectionObserverEntry` 的实例作为 `entries` 参数被传递到一个 `IntersectionObserver` 的回调函数中; 此外，这些对象只能通过调用`IntersectionObserver.takeRecords()` 来获取。

属性
--

`IntersectionObserverEntry.boundingClientRect` (en-US) 只读 

返回包含目标元素的边界信息的`DOMRectReadOnly`. 边界的计算方式与 `Element.getBoundingClientRect()` 相同。

`IntersectionObserverEntry.intersectionRatio` (en-US) 只读 

返回`intersectionRect` 与 `boundingClientRect` 的比例值。

`IntersectionObserverEntry.intersectionRect` (en-US) 只读 

返回一个 `DOMRectReadOnly` 用来描述根和目标元素的相交区域。

`IntersectionObserverEntry.isIntersecting` (en-US) 只读 

返回一个布尔值，如果目标元素与交叉区域观察者对象 (intersection observer) 的根相交，则返回 `true` .如果返回 `true`, 则 `IntersectionObserverEntry` 描述了变换到交叉时的状态; 如果返回 `false`, 那么可以由此判断，变换是从交叉状态到非交叉状态。

`IntersectionObserverEntry.rootBounds` (en-US) 只读 

返回一个 `DOMRectReadOnly` 用来描述交叉区域观察者 (intersection observer) 中的根。

`IntersectionObserverEntry.target` (en-US) 只读 

与根出现相交区域改变的元素 (`Element`).

`IntersectionObserverEntry.time` (en-US) 只读 

返回一个记录从 `IntersectionObserver` 的时间原点 (time origin) 到交叉被触发的时间的时间戳 (`DOMHighResTimeStamp`).

方法
--

*此接口没有方法。*

规范
--

| Specification |
| --- |
| Intersection Observer # intersection-observer-entry |

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

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

`AudioDestinationNode`接口表示音频图形在特定情况下的最终输出地址 - 通常为扬声器。当使用`OfflineAudioContext`时为音频记录节点。

AudioDestinationNode 没有输出（因为它就是输出，它存在于视频图标中后 AudioNode 不能被链接），有一个输入。输入信道的数量必须是 0 至 maxChannelCount 之间的值或是一个异常。

`AudioDestinationNode` 可以通过 `AudioContext.destination` 属性来查看。

|  |  |
| --- | --- |
| Number of inputs | `1` |
| Number of outputs | `0` |
| Channel count mode | `"explicit"` |
| Channel count | `2` |
| Channel interpretation | `"speakers"` |

属性
--

*从`AudioNode`继承的属性*.

`AudioDestinationNode.maxChannelCount`

以无符长整型返回物理设备可以处理的最大通道数量。

方法
--

*继承 `AudioNode` 的方法。*

例子
--

`AudioDestinationNode 不需要使用复杂的设置` — 在默认情况下只是简单的代表使用者系统的输出 (例如他们的扬声器)，这样你就可以使用几行代码来与内置音频图标挂钩：


```js
var audioCtx = new AudioContext();
var source = audioCtx.createMediaElementSource(myMediaElement);
source.connect(gainNode);
gainNode.connect(audioCtx.destination);
```


更多的例子，请查看 MDN Web Audio 示例，例如Voice-change-o-matic 或者 Violent Theremin.

标准
--

| Specification |
| --- |
| Web Audio API # AudioDestinationNode |

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

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

参见
--

* Using the Web Audio API
ReadableStream
==============

Stream API 中的 `ReadableStream` 接口表示可读的字节数据流。Fetch API 通过 `Response` 的属性 `body` (en-US) 提供了一个具体的 `ReadableStream` 对象。

构造函数
----

`ReadableStream()`

创建并从给定的处理程序返回一个可读流对象。

实例属性
----

`ReadableStream.locked` 只读 

`locked` 返回该可读流是否被锁定到一个 reader。

实例方法
----

`ReadableStream.cancel()`

取消读取流，读取方发出一个信号，表示对这束流失去兴趣。可以传入 reason 参数表示取消原因，这个原因将传回给调用方。

`ReadableStream.getReader()`

创建一个读取器并将流锁定于其上。一旦流被锁定，其他读取器将不能读取它，直到它被释放。

`ReadableStream.pipeThrough()`

提供将当前流管道输出到一个转换（transform）流或可写/可读流对的链式方法。

`ReadableStream.pipeTo()`

将当前 ReadableStream 管道输出到给定的 `WritableStream`，并返回一个 promise，该 promise 在输出过程成功完成时兑现，在发生错误时拒绝。

`ReadableStream.tee()`

`tee` 方法拷贝了可读流，返回包含两个 `ReadableStream` 实例分支的数组，每个元素接收了相同的传输数据。

示例
--

### Fetch 流

下面的例子，创建了一个智能的 `Response` 将从另一个资源获取的 HTML 片段流式的传输到浏览器。

它演示了 `ReadableStream` 与 `Uint8Array` (en-US) 的协同用法。


```js
fetch("https://www.example.org")
  .then((response) => response.body)
  .then((rb) => {
    const reader = rb.getReader();
    return new ReadableStream({
      start(controller) {
        // The following function handles each data chunk
        function push() {
          // "done" is a Boolean and value a "Uint8Array"
          reader.read().then(({ done, value }) => {
            // If there is no more data to read
            if (done) {
              console.log("done", done);
              controller.close();
              return;
            }
            // Get the data and send it to the browser via the controller
            controller.enqueue(value);
            // Check chunks by logging to the console
            console.log(done, value);
            push();
          });
        }
        push();
      },
    });
  })
  .then((stream) =>
    // Respond with our stream
    new Response(stream, { headers: { "Content-Type": "text/html" } }).text(),
  )
  .then((result) => {
    // Do things with result
    console.log(result);
  });
```

### 转换异步迭代器到流

将（异步）迭代器转换为可读流：


```js
function iteratorToStream(iterator) {
  return new ReadableStream({
    async pull(controller) {
      const { value, done } = await iterator.next();
      if (done) {
        controller.close();
      } else {
        controller.enqueue(value);
      }
    },
  });
}
```


这适用于异步和非异步的迭代器。

### 使用 for await...of 对流进行异步迭代

此示例展示了如何使用 `for await...of` 循环来迭代到达的分块，以处理 `fetch()` 响应。


```js
const response = await fetch("https://www.example.org");
let total = 0;

// Iterate response.body (a ReadableStream) asynchronously
for await (const chunk of response.body) {
  // Do something with each chunk
  // Here we just accumulate the size of the response.
  total += chunk.length;
}

// Do something with the total
console.log(total);
```

规范
--

| Specification |
| --- |
| Streams Standard # rs-class |

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

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

参见
--

* Stream API 概念
* 使用可读流
* 使用可读字节流 (en-US)
* WHATWG Stream Visualiser，用于可读、可写和转换流的基本可视化。
* Web-streams-polyfill 或 sd-streams——polyfill
MediaSource
===========

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

**`MediaSource`** 是 Media Source Extensions API 表示媒体资源 `HTMLMediaElement` 对象的接口。`MediaSource` 对象可以附着在 `HTMLMediaElement` 在客户端进行播放。

构造函数
----

`MediaSource()`

创建并且返回一个新的 `MediaSource` 的空对象（with no associated source buffers）。

属性
--

`MediaSource.sourceBuffers` 只读 

返回一个 `SourceBufferList` 对象，包含了这个 `MediaSource` 的 `SourceBuffer` 的对象列表。

`MediaSource.activeSourceBuffers` 只读 

 返回一个 `SourceBufferList` 对象，包含了这个 `MediaSource.sourceBuffers` 中的 `SourceBuffer`
 子集的对象—即提供当前被选中的视频轨（video track），启用的音频轨（audio tracks）以及显示/隐藏的字幕轨（text tracks）的对象列表。


`MediaSource.readyState` 只读 

返回一个代表当前 `MediaSource` 状态的枚举值，即当前是否未连接到媒体元素（`closed`），是否已连接并准备好接收 `SourceBuffer` 对象（`open`），或者是否已连接但已通过 `MediaSource.endOfStream()` 结束媒体流（`ended`）。

`MediaSource.duration`

获取和设置当前正在推流媒体的持续时间。

方法
--

*从父接口`EventTarget`上继承而来。*

`MediaSource.addSourceBuffer()`

创建一个带有给定 MIME 类型的新的 `SourceBuffer` 并添加到 `MediaSource` 的 `SourceBuffers` 列表。

`MediaSource.removeSourceBuffer()`

删除指定的 `SourceBuffer` 从这个 `MediaSource` 对象中的 `SourceBuffers`列表。

`MediaSource.endOfStream()`

表示流的结束。

静态方法
----

`MediaSource.isTypeSupported()`

返回一个 `Boolean` (en-US) 值表明给定的 MIME 类型是否被当前的浏览器支持——这意味着是否可以成功的创建这个 MIME 类型的 `SourceBuffer` 对象。

示例
--

这个例子尽可能快地逐块加载视频，并在加载好后立刻播放。以下片段基于 Nick Desaulniers 编写的一个简单示例（查看完整的在线演示，或者下载源代码进行进一步研究）。


```js
const video = document.querySelector("video");

const assetURL = "frag\_bunny.mp4";
// Need to be specific for Blink regarding codecs
// ./mp4info frag\_bunny.mp4 | grep Codec
const mimeCodec = 'video/mp4; codecs="avc1.42E01E, mp4a.40.2"';

if ("MediaSource" in window && MediaSource.isTypeSupported(mimeCodec)) {
  const mediaSource = new MediaSource();
  //console.log(mediaSource.readyState); // closed
  video.src = URL.createObjectURL(mediaSource);
  mediaSource.addEventListener("sourceopen", sourceOpen);
} else {
  console.error("Unsupported MIME type or codec: ", mimeCodec);
}

function sourceOpen(\_) {
  //console.log(this.readyState); // open
  const mediaSource = this;
  const sourceBuffer = mediaSource.addSourceBuffer(mimeCodec);
  fetchAB(assetURL, function (buf) {
    sourceBuffer.addEventListener("updateend", function (\_) {
      mediaSource.endOfStream();
      video.play();
      //console.log(mediaSource.readyState); // ended
    });
    sourceBuffer.appendBuffer(buf);
  });
}

function fetchAB(url, cb) {
  console.log(url);
  const xhr = new XMLHttpRequest();
  xhr.open("get", url);
  xhr.responseType = "arraybuffer";
  xhr.onload = function () {
    cb(xhr.response);
  };
  xhr.send();
}
```

规范
--

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

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

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

参见
--

* `SourceBuffer`
* `SourceBufferList`
DeviceAcceleration
==================

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

设备加速对象可以提供有关设备沿三个轴（x、y、z）的加速度的信息。

属性
--

`DeviceAcceleration.x` (en-US) 只读 

沿 X 轴的加速度量（只读）

`DeviceAcceleration.y` (en-US) 只读 

沿 Y 轴的加速度量（只读）

`DeviceAcceleration.z` (en-US) 只读 

沿 Z 轴的加速度量（只读）

说明
--

| Specification |
| --- |
| DeviceOrientation Event Specification # devicemotioneventacceleration |
MIDIConnectionEvent
===================

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

The **`MIDIConnectionEvent`** interface of the Web MIDI API (en-US) is the event passed to the `onstatechange` (en-US) event of the `MIDIAccess` interface and the `onstatechange` event of the `MIDIPorts` interface. This occurs any time a new port becomes available, or when a previously available port becomes unavailable. 例如，这个事件无论是在一个 MIDI 设备插入或拔出设备时都会触发。

构造函数
----

`MIDIConnectionEvent.MIDIConnectionEvent` (en-US)

创建一个新的 `MIDIConnectionEvent` 对象。

属性
--

`MIDIConnectionEvent.port` (en-US)

返回一个 `MIDIPort` (en-US) 实例的引用，指明其端口是否已经连接。

举例
--

规范
--

| Specification |
| --- |
| Web MIDI API # midiconnectionevent-interface |

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

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

**`IntersectionObserver`** 接口（从属于 Intersection Observer API）提供了一种异步观察目标元素与其祖先元素或顶级文档视口（viewport）交叉状态的方法。其祖先元素或视口被称为根（root）。

当一个 `IntersectionObserver` 对象被创建时，其被配置为监听根中一段给定比例的可见区域。一旦 `IntersectionObserver` 被创建，则无法更改其配置，所以一个给定的观察者对象只能用来监听可见区域的特定变化值；然而，你可以在同一个观察者对象中配置监听多个目标元素。

构造函数
----

`IntersectionObserver()`

创建一个新的 `IntersectionObserver` 对象，当其监听到目标元素的可见部分（的比例）超过了一个或多个**阈值**（threshold）时，会执行指定的回调函数。

实例属性
----

`IntersectionObserver.root` 只读 

测试交叉时，用作边界盒的元素或文档。如果构造函数未传入 `root` 或其值为`null`，则默认使用顶级文档的视口。

`IntersectionObserver.rootMargin` 只读 

计算交叉时添加到根边界盒 (en-US)的矩形偏移量，可以有效的缩小或扩大根的判定范围从而满足计算需要。此属性返回的值可能与调用构造函数时指定的值不同，因此可能需要更改该值，以匹配内部要求。所有的偏移量均可用**像素**（`px`）或**百分比**（`%`）来表达，默认值为“0px 0px 0px 0px”。

`IntersectionObserver.thresholds` (en-US) 只读 

一个包含阈值的列表，按升序排列，列表中的每个阈值都是监听对象的交叉区域与边界区域的比率。当监听对象的任何阈值被越过时，都会生成一个通知（Notification）。如果构造器未传入值，则默认值为 0。

实例方法
----

`IntersectionObserver.disconnect()`

使 `IntersectionObserver` 对象停止监听目标。

`IntersectionObserver.observe()`

使 `IntersectionObserver` 开始监听一个目标元素。

`IntersectionObserver.takeRecords()`

返回所有观察目标的 `IntersectionObserverEntry` 对象数组。

`IntersectionObserver.unobserve()`

使 `IntersectionObserver` 停止监听特定目标元素。

示例
--


```js
const intersectionObserver = new IntersectionObserver((entries) => {
  // 如果 intersectionRatio 为 0，则目标在视野外，
  // 我们不需要做任何事情。
  if (entries[0].intersectionRatio <= 0) return;

  loadItems(10);
  console.log("Loaded new items");
});
// 开始监听
intersectionObserver.observe(document.querySelector(".scrollerFooter"));
```

规范
--

| Specification |
| --- |
| Intersection Observer # intersection-observer-interface |

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

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

参见
--

* `MutationObserver`
* `PerformanceObserver`
* `ResizeObserver`
File
====

文件（**`File`**）接口提供有关文件的信息，并允许网页中的 JavaScript 访问其内容。

通常情况下， `File` 对象是来自用户在一个 `<input>` 元素上选择文件后返回的 `FileList` 对象，也可以是来自由拖放操作生成的 `DataTransfer` 对象，或者来自 `HTMLCanvasElement` 上的 `mozGetAsFile`() API。在 Gecko 中，特权代码可以创建代表任何本地文件的 File 对象，而无需用户交互（有关详细信息，请参阅注意事项。

`File` 对象是特殊类型的 `Blob`，且可以用在任意的 Blob 类型的 context 中。比如说， `FileReader`, `URL.createObjectURL()`, `createImageBitmap()` (en-US), 及 `XMLHttpRequest.send()` 都能处理 `Blob` 和 `File`。

参考 从 Web 应用程序使用文件 了解更多信息和例子。

构造函数
----

`File()`

返回一个新构建的文件对象（`File`）。

属性
--

`File` 接口也继承了 `Blob` 接口的属性：

`File.lastModified` 只读 

返回当前 `File` 对象所引用文件最后修改时间，自 UNIX 时间起始值（1970 年 1 月 1 日 00:00:00 UTC）以来的毫秒数。

`File.lastModifiedDate` 只读  
已弃用

返回当前 `File` 对象所引用文件最后修改时间的 `Date` 对象。

`File.name` 只读 

返回当前 `File` 对象所引用文件的名字。

`File.size` 只读 

返回文件的大小。

`File.webkitRelativePath` 只读  
非标准

返回 `File` 相关的 path 或 URL。

`Blob.type` 只读 

返回文件的 多用途互联网邮件扩展类型（MIME Type）

方法
--

*`File` 接口没有定义任何方法，但是它从 `Blob` 接口继承了以下方法：*

`Blob.slice([start[, end[, contentType]]])`

返回一个新的 `Blob` 对象，它包含有源 `Blob` 对象中指定范围内的数据。

规范
--

| Specification |
| --- |
| File API # file-section |

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

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

### 注意事项

* 在 Gecko 中，你可以从 Chrome 代码中使用这个 API。详细内容参见 Using the DOM File API in chrome code。若要从 chrome 代码，JSM 和引导范围中使用它，你必须使用 `Cu.importGlobalProperties(['File']);` 来导入它。
* 从 Gecko 6.0 开始，在特权代码（比如扩展中的代码）中，可以将一个 `nsIFile` 对象传入 `File` 构造函数，从而生成一个 File 对象。
* 从 Gecko 8.0 开始，在 XPCOM 组件代码中，你可以直接使用 `new File` 来创建一个 `File` 对象，而不需要像以前那样必须实例化一个 `nsIDOMFile` 对象。`File` 对象和 `Blob` 相反，使用第二个参数作为文件名。文件名可以是任意的字符串。
```

new File( Array parts, String filename, BlobPropertyBag properties);
```

* 下列非标准属性及方法在 Gecko 7 中就被移除了：`File.fileName`、`File.fileSize`、`File.getAsBinary()`、`File.getAsDataURL()`、`File.getAsText(string encoding)` (Firefox bug 661876)。应当使用 `File.name`、`Blob.size`，和 `FileReader` 的方法来代替。
参见
--

* 如何在 Web 应用程序中使用文件
* `FileReader`
* 在 chrome 代码中使用 DOM File API 读取文件（适用于被授权在 Gecko 中运行的代码，例如 Firefox 拓展的代码）
RTCDataChannel
==============

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

RTCDataChannel 接口代表在两者之间建立了一个双向数据通道的连接。

可以用 `RTCDataChannel.createDataChannel()` 或者在现有的 `RTCPeerConnection` 上用 `RTCDataChannelEvent` (en-US) 类型的 `datachannel` 事件接收，创建出 RTCDataChannel 类型的对象。

**备注：** 这个 API 在 Gecko 中被称作 DataChannel 而不是标准的'RTCDataChannel'。

属性
--

`RTCDataChannel.label` (en-US) 只读 

返回一个包含有描述数据通道名字的`DOMString`。这个字段没有唯一性要求。

`RTCDataChannel.ordered` (en-US) 只读 

返回一个`Boolean` (en-US)对象，表示传递信息的顺序是否有保证。

`RTCDataChannel.protocol` (en-US) 只读 

返回一个包含有正在使用的子协议的名称的 `DOMString`，如果没有这样的子协议，返回""

`RTCDataChannel.id` (en-US) 只读 

当`RTCDataChannel`对象被创建出来的时候，返回一个无符号 short 类型的数据，作为通道的标识 id。

`RTCDataChannel.readyState` (en-US) 只读 

返回枚举类型的 RTCDataChannelState，表示数据连接的状态，有以下几种类型：

* `"connecting"` 该状态表示底层链路还未建立和激活，该状态还是由`RTCPeerConnection.createDataChannel()`生成的 datachannel 初始状态。
* `"open"` 该状态表示底层链路已经连接成功并且运行。这个状态还是由`RTCDataChannelEvent` (en-US)分发的 datachannel 的初始状态。
* `"closing"` 该状态表示底层链路已经在关闭的过程中。该状态下将不会接受新的发送任务，但是缓冲队列中的消息还是会被继续发送或者接收。
* `"closed"` 该状态表示底层链路已经完全被关闭（或者无法处于 established 状态）。

`RTCDataChannel.bufferedAmount` (en-US) 只读 

返回一个`unsigned long`，表示缓冲队列中等待发送的字节数。这些数据是通过`RTCDataChannel.send()` (en-US)添加进缓冲队列但还未被发送的数据请求。注意：就算 channel 处于`closed`状态，队列中的缓存还会保持。

`RTCDataChannel.binaryType` (en-US)

是一个`DOMString` 类型，表示由链路发送的二进制数据的类型。该项的值应该为`"blob"`或者`"arraybuffer"`，默认值为`"blob"`。当值为`"blob"`的时候，使用`Blob`对象，当值为`"arraybuffer"`时，使用`ArrayBuffer`对象

`RTCDataChannel.maxPacketLifeType` 只读 

是一个`unsigned short`类型，表示不可靠模式下的消息发送允许时间长度，单位为毫秒。

`RTCDataChannel.maxRetransmits` (en-US) 只读 

是一个`unsigned short`类型，表示不可靠模式下消息允许尝试重发的最大次数。

`RTCDataChannel.negotiated` (en-US) 只读 

是一个`Boolean` (en-US)类型，表示这个 channel 是否已经通过应用协商。

`DataChannel.reliable` 
非标准
 只读 

是一个`Boolean` (en-US)类型，表示这个链接能不能以非可靠模式发送消息。已经废弃的 api。

`DataChannel.stream` 
非标准
 只读 

和`RTCDataChannel.id` (en-US)等效，已经废弃的 api。

### 事件处理器

`RTCDataChannel.onopen` (en-US)

当接收到 `open` 事件时的事件处理器，当底层链路数据传输成功，端口状态处于 established 的时候会触发该事件。

`RTCDataChannel.onmessage` (en-US)

当接收到 `message` 事件时的事件处理器。当有数据被接收的时候会触发该事件。

`RTCDataChannel.onclose` (en-US)

当接收到 `close` 事件时候的事件处理器。当底层链路被关闭的时候会触发该事件。

`RTCDataChannel.onerror` (en-US)

当接收到 `error` 事件时候的事件处理器。当遇到错误的时候会触发该事件。

方法
--

`RTCDataChannel.close()` (en-US)

关闭 channel 的方法。这个关闭动作不是直接生效的。这个方法会将 channel 的`state` (en-US) 属性设置为`"closing"`状态，在消息队列中的消息全部发送完毕之后，channel 才会被关闭。

`RTCDataChannel.send()` (en-US)

将参数中的数据通过 channel 发送。这个数据可以是`DOMString`, `Blob`, `ArrayBuffer`或者是 `ArrayBufferView`类型。

示例
--


```js
var pc = new RTCPeerConnection();
var dc = pc.createDataChannel("my channel");

dc.onmessage = function (event) {
  console.log("received: " + event.data);
};

dc.onopen = function () {
  console.log("datachannel open");
};

dc.onclose = function () {
  console.log("datachannel close");
};
```

规范
--

| Specification |
| --- |
| WebRTC: Real-Time Communication in Browsers # rtcdatachannel |

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

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

参见
--

* WebRTC
MessageChannel
==============

Channel Messaging API 的 **`MessageChannel`** 接口允许我们创建一个新的消息通道，并通过它的两个 `MessagePort` 属性发送数据。

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

属性
--

`MessageChannel.port1` 只读 

返回 channel 的 port1。

`MessageChannel.port2` 只读 

返回 channel 的 port2。

构造函数
----

`MessageChannel()`

返回一个带有两个 MessagePort 属性的 MessageChannel 新对象。

示例
--

在以下代码块中，你可以看到使用 MessageChannel 构造函数实例化了一个 channel 对象。当 iframe 加载完毕，我们使用 MessagePort.postMessage 方法把一条消息和 MessageChannel.port2 传递给 iframe。handleMessage 处理程序将会从 iframe 中（使用 MessagePort.onmessage 监听事件）接收到信息，将数据其放入 innerHTML 中。


```js
var channel = new MessageChannel();
var para = document.querySelector("p");

var ifr = document.querySelector("iframe");
var otherWindow = ifr.contentWindow;

ifr.addEventListener("load", iframeLoaded, false);

function iframeLoaded() {
  otherWindow.postMessage("Hello from the main page!", "\*", [channel.port2]);
}

channel.port1.onmessage = handleMessage;
function handleMessage(e) {
  para.innerHTML = e.data;
}
```


有关更完整的运行示例，可以在 GitHub 上查看 channel messaging 基本示例（也可以在线运行示例）。

规范
--

| Specification |
| --- |
| HTML Standard # message-channels |

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

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

参见
--

* Using channel messaging
SVGAElement
===========

SVG DOM 接口
----------

`SVGAElement`接口提供了对`<a>`元素的属性的访问，而且还提供了操作该元素的方法。

### 接口概览

|  |  |
| --- | --- |
| 作用于 | `SVGElement`、
 `SVGURIReference` (en-US)、
 `SVGTests`、
 `SVGLangSpace`、
 `SVGExternalResourcesRequired`、
 `SVGStylable` (en-US)、
 `SVGTransformable` |
| 方法 | *无* |
| 属性 | * 只读属性 `SVGAnimatedString` (en-US)
`target`
 |
| 规范文档 | SVG 1.1 (2nd Edition) |

属性
--

这个接口同样会从父级元素 \*`SVGGraphicsElement`\*继承属性，并实现 *`SVGURIReference` (en-US)* 和 *`HTMLHyperlinkElementUtils`* 中的功能。

`SVGAElement.download`

参见 `HTMLAnchorElement.download`

`SVGAElement.href`

参见 `HTMLAnchorElement.href`

`SVGAElement.hreflang`

是一个反映 `hreflang` 属性的字符串（DOMString），表示链接资源的语言种类。

`SVGAElement.ping`

是一个反映 ping 值的字符串（DOMString），包含以空格分隔开的 URL 列表，当超链接可以被跟踪时，浏览器会（在后台）发送有 PING 主体的 `POST` 的请求，一般用于追踪。

`SVGAElement.referrerPolicy`

参见 `HTMLAnchorElement.referrerPolicy`

`SVGAElement.rel`

参见 `HTMLAnchorElement.rel` (en-US)

`SVGAElement.relList`

参见`HTMLAnchorElement.relList` (en-US)

`SVGAElement.target` (en-US) 只读 

它和特定元素的 `target` 属性相同

`SVGAElement.text`

是一个字符串（DOMString），作为 `Node.textContent` 属性的代名词。

`SVGAElement.type`

是一个反映 `type` 属性的字符串（DOMString），表示链接资源的 MIME 种类。

方法
--

该 `SVGAElement` 接口没有提供任何专有的方法。

示例
--

在下面的这个例子里， `<a>` 元素的 `target` 属性值是 `_blank` ，当链接被点击时，它将记录以通知是否符合条件。


```js
var linkRef = document.querySelector("a");
linkRef.target = "\_self";

linkRef.onclick = function () {
  if (linkRef.target === "\_blank") {
    console.log("BLANK!");
    linkRef.target = "\_self";
  } else {
    console.log("SORRY! not \_blank");
  }
};
```

规范
--

| Specification |
| --- |
| Scalable Vector Graphics (SVG) 2 # InterfaceSVGAElement |

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

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

参见
--

* `<a>` SVG 元素
TextEncoderStream
=================

Encoding API 的 **`TextEncoderStream`** 接口将一个字符串流转换为 UTF-8 编码的字节。它与 `TextEncoder` 的流形式等价。

构造函数
----

`TextEncoderStream()`

创建一个新的 `TextEncoderStream` 对象。

属性
--

`TextEncoderStream.encoding`只读 

总是返回"`utf-8`"。

`TextEncoderStream.readable`只读 

返回此对象控制的 `ReadableStream` 实例。

`TextEncoderStream.writable`只读 

返回此对象控制的 `WritableStream` 实例。

示例
--

* 流式传输结构化数据和 HTML 示例
* 一个使用 `TextDecoderStream` 流式处理 fetch 请求的示例。
规范
--

| Specification |
| --- |
| Encoding Standard # interface-textencoderstream |

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

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

参见
--

* `TextDecoderStream`
* Streams API 概念
* Experimenting with the Streams API
StylePropertyMap
================

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

CSS 类型对象模型 API (en-US) 的 **`StylePropertyMap`** 接口提供了 CSS 声明块的表示，该声明块可以替代 `CSSStyleDeclaration`。

StylePropertyMapReadOnly

(en-US)

StylePropertyMap属性
--

*从其父级 `StylePropertyMapReadOnly` (en-US) 继承属性。*

方法
--

*从其父级 `StylePropertyMapReadOnly` (en-US) 继承方法。*

`StylePropertyMap.append()` (en-US)

使用给定的属性和值向 `StylePropertyMap` 添加新的 CSS 声明。

`StylePropertyMap.clear()` (en-US)

删除 `StylePropertyMap` 中的所有声明。

`StylePropertyMap.delete()` (en-US)

使用给定属性删除 CSS 声明。

`StylePropertyMap.set()` (en-US)

使用给定属性更改 CSS 声明。

规范
--

| Specification |
| --- |
| CSS Typed OM Level 1 # the-stylepropertymap |

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

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

**`PositionError`** 接口表示当定位设备位置时发生错误的原因。

属性
--

*`PositionError` 接口没有继承任何属性。*

`PositionError.code` (en-US) 只读 

返回无符号的、简短的错误码。下列值是可能的：

| 值 | 相关联的常量 | 描述 |
| --- | --- | --- |
| `1` | `PERMISSION_DENIED` | 地理位置信息的获取失败，因为该页面没有获取地理位置信息的权限。 |
| `2` | `POSITION_UNAVAILABLE` | 地理位置获取失败，因为至少有一个内部位置源返回一个内部错误。 |
| `3` | `TIMEOUT` | 获取地理位置超时，通过定义`PositionOptions.timeout` 来设置获取地理位置的超时时长。 |

`PositionError.message` (en-US) 只读 

返回一个开发者可以理解的 `DOMString` 来描述错误的详细信息。

方法
--

**`PositionError` 接口没有实现也没有*继承任何方法。***

标准
--

| Specification |
| --- |
| Geolocation API # position\_error\_interface |

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

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

请参见
---

* Using geolocation
* The `Geolocation` interface that use it.
PromiseRejectionEvent
=====================

**`PromiseRejectionEvent`** 接口表示出现在 JavaScript `Promise`s 被 rejecte (拒绝) 时触发的事件。这些事件对遥测 (远程测试) 和调试特别的有用。

构造函数
----

`PromiseRejectionEvent()`

用给定的参数生成一个 `PromiseRejectionEvent` 事件。

属性
--

*也从它的父级`Event`继承属性。*

`PromiseRejectionEvent.promise` 只读 

被 rejected 的 JavaScript `Promise` 。

`PromiseRejectionEvent.reason` (en-US) 只读 

一个值或 `Object` 表明为什么 promise 被 rejected，并传递给`Promise.reject()`。

方法
--

*没有特定的方法; 从它的父级 `Event`继承方法。*

事件
--

`rejectionhandled`

在一个 JavaScript `Promise` 被 reject 时触发，在 reject 后由 promise 的 reject 处理函数处理。

`unhandledrejection`

在一个 JavaScript `Promise` 被 reject（拒绝）但是没有 reject 处理函数来处理时触发。

示例
--


```js
window.onunhandledrejection = function (e) {
  console.log(e.reason);
};
```

规范
--

| Specification |
| --- |
| HTML Standard # the-promiserejectionevent-interface |

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

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

参见
--

* `Promise`
* `onrejectionhandled`
* `onunhandledrejection`