recursal/MDN huggingface dataset:
NavigationPreloadManager
========================

Service Worker API の **`NavigationPreloadManager`** インターフェイスは、サービスワーカーによるリソースのプリロード（事前読み込み）を管理するためのメソッドを提供します。

メソッド
----

`NavigationPreloadManager.enable()` (en-US)

ナビゲーションのプリロードを有効にし、解決する `Promise` を返します。

`NavigationPreloadManager.disable()` (en-US)

ナビゲーションのプリロードを無効にし、解決する `Promise` を返します。

`NavigationPreloadManager.setHeaderValue()` (en-US)

`Service-Worker-Navigation-Preload` ヘッダーの値を設定し、空の `Promise` を返します。

`NavigationPreloadManager.getState()` (en-US)

プリロードが有効かどうかと、`Service-Worker-Navigation-Preload` の内容を示すプロパティを持つオブジェクトに解決する `Promise` を返します。

例
-

#### ナビゲーションのプリロードの機能を検出して有効化


```js
addEventListener("activate", (event) => {
  event.waitUntil(
    (async function () {
      if (self.registration.navigationPreload) {
        // ナビゲーションのプリロードを有効にします！
        await self.registration.navigationPreload.enable();
      }
    })(),
  );
});
```


#### プリロードされたレスポンスの使用

次の例は、プリロードされたレスポンスを使用する fetch イベントの実装を示しています。


```js
addEventListener("fetch", (event) => {
  event.respondWith(
    (async function () {
      // 可能なら、キャッシュから応答します
      const cachedResponse = await caches.match(event.request);
      if (cachedResponse) return cachedResponse;

      // それがなく、プリロードされたレスポンスがあれば、それを使用します
      const response = await event.preloadResponse;
      if (response) return response;

      // それもなければ、ネットワークを試します。
      return fetch(event.request);
    })(),
  );
});
```

仕様
--

| Specification |
| --- |
| Service Workers # navigation-preload-manager |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
WEBGL\_color\_buffer\_float
===========================

**`WEBGL_color_buffer_float`** 拡張は WebGL API の一部で、 32 ビット浮動小数点数の色バッファーにレンダリングする機能を追加します。

WebGL 拡張は `WebGLRenderingContext.getExtension()` (en-US) メソッドを使用することで利用することができます。詳細な情報については、WebGL チュートリアルの Using Extensions も参照してください。

**メモ:** この拡張機能は WebGL 1 コンテキストでのみ利用することができます。 WebGL 2 (en-US) では `EXT_color_buffer_float` (en-US) 拡張を使用してください。

`OES_texture_float` (en-US) 拡張は、暗黙にこの拡張を有効にします。

定数
--

`ext.RGBA32F_EXT`

RGBA 32 ビット浮動小数点数でカラーレンダリング可能な形式。

`ext.RGB32F_EXT` (
非推奨
)

RGB 32 ビット浮動小数点数で、カラーレンダリング可能な形式。

`ext.FRAMEBUFFER_ATTACHMENT_COMPONENT_TYPE_EXT`

?

`ext.UNSIGNED_NORMALIZED_EXT`

?

拡張されるメソッド
---------

この拡張機能は `WebGLRenderingContext.renderbufferStorage()` (en-US) を拡張します。

* `internalformat` 引数が `ext.RGBA32F_EXT` および `ext.RGB32F_EXT` (
非推奨
) を受け付けるようになります。
例
-


```js
const ext = gl.getExtension("WEBGL\_color\_buffer\_float");

gl.renderbufferStorage(gl.RENDERBUFFER, ext.RGBA32F\_EXT, 256, 256);
```

仕様書
---

| Specification |
| --- |
| WebGL WEBGL\_color\_buffer\_float Extension Specification  |

ブラウザーの互換性
---------

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

関連情報
----

* `WebGLRenderingContext.getExtension()` (en-US)
* `WebGLRenderingContext.renderbufferStorage()` (en-US)
* `OES_texture_float` (en-US)
PeriodicSyncManager
===================

**Experimental:** **これは実験的な機能です。**  
本番で使用する前にブラウザー互換性一覧表をチェックしてください。

**`PeriodicSyncManager`** は`ウェブ定期バックグラウンド同期 API` のインターフェイスは、ネットワーク接続のある定期的な間隔で実行するタスクをサービスワーカーの中に登録する方法を提供します。これらのタスクは、定期バックグラウンド同期リクエストと呼ばれます。`PeriodicSyncManager` には `ServiceWorkerRegistration.periodicSync` を通してアクセスします。

インスタンスプロパティ
-----------

なし。

インスタンスメソッド
----------

`PeriodicSyncManager.register` 
Experimental

指定したタグとオプションでブラウザーに定期同期リクエストを登録します。登録が完了した時点で解決する `Promise` を返します。

`PeriodicSyncManager.getTags` 
Experimental

定期同期を行うために現在登録されているタグを表す文字列のリストで解決される `Promise` を返します。

`PeriodicSyncManager.unregister` 
Experimental

指定されたタグに対応する定期同期のリクエストを登録解除し、登録解除が完了すると解決する `Promise` を返します。

例
-

次の例は、インターフェイスを使用する方法を示しています。

### 定期バックグラウンド同期のリクエスト

以下の非同期関数は、閲覧コンテキストから最小 1 日間隔で定期バックグラウンド同期を登録するものです。


```js
async function registerPeriodicNewsCheck() {
  const registration = await navigator.serviceWorker.ready;
  try {
    await registration.periodicSync.register("get-latest-news", {
      minInterval: 24 \* 60 \* 60 \* 1000,
    });
  } catch {
    console.log("Periodic Sync could not be registered!");
  }
}
```

### タグによる定期バックグラウンド同期の検証

このコードは、指定されたタグを持つ定期バックグラウンド同期タスクが登録されているかどうかを調べるものです。


```js
navigator.serviceWorker.ready.then((registration) => {
  registration.periodicSync.getTags().then((tags) => {
    if (tags.includes("get-latest-news")) skipDownloadingLatestNewsOnPageLoad();
  });
});
```

### 定期バックグラウンド同期タスクの削除

以下は、定期バックグラウンド同期タスクを削除して、バックグラウンドでの記事同期を停止するコードです。


```js
navigator.serviceWorker.ready.then((registration) => {
  registration.periodicSync.unregister("get-latest-news");
});
```

仕様書
---

| Specification |
| --- |
| Web Periodic Background Synchronization # periodicsyncmanager-interface |

ブラウザーの互換性
---------

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

関連情報
----

* Richer offline experiences with the Periodic Background Sync API
* A Periodic Background Sync demo app
NDEFMessage
===========

**安全なコンテキスト用:** この機能は一部またはすべての対応しているブラウザーにおいて、安全なコンテキスト (HTTPS) でのみ利用できます。

**Experimental:** **これは実験的な機能です。**  
本番で使用する前にブラウザー互換性一覧表をチェックしてください。

**`NDEFMessage`** はウェブ NFC API のインターフェイスで、 NFC タグで読み書きされる NDEF メッセージの内容を表します。インスタンスは `NDEFMessage()` コンストラクターを呼び出すか、 `reading` イベントに渡される `NDEFReadingEvent.message` プロパティを用いるかして取得します。

コンストラクター
--------

`NDEFMessage()`

新しい `NDEFMessage` オブジェクトを生成し、指定された NDEF レコードで初期化します。

プロパティ
-----

`NDEFMessage.records`読取専用 

メッセージに含まれる NDEF レコードのリストを返します。

仕様書
---

| Specification |
| --- |
| Web NFC API # dom-ndefmessage |

ブラウザーの互換性
---------

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

**`UIEvent`** インターフェイスは、シンプルなユーザーインターフェイスのイベントを表します。

`UIEvent` は `Event` から派生しています。後方互換性のために `UIEvent.initUIEvent()` メソッドは維持されていますが、`UIEvent` オブジェクトは `UIEvent()` コンストラクターを使用して作成すべきです。

`MouseEvent`、`TouchEvent`、`FocusEvent`、`KeyboardEvent`、`WheelEvent`、`InputEvent`、`CompositionEvent` といったインターフェイスが、このインターフェイスの直接または間接の子孫です。

Event

UIEventコンストラクター
--------

`UIEvent()`

`UIEvent` オブジェクトを作成します。

インスタンスプロパティ
-----------

*このインターフェイスは、親である `Event` からプロパティを継承しています。*

`UIEvent.detail` 読取専用 

`long` で、イベントの種類に応じて、イベントに関する詳細を返します。

`UIEvent.sourceCapabilities` 
Experimental
 読取専用 

タッチイベントの生成元である物理的な機器に関する情報を提供する、 `InputDeviceCapabilities` インターフェイスのインスタンスを返します。

`UIEvent.view` 読取専用 

イベントを生成したビューを含む WindowProxy を返します。

`UIEvent.which` 
非推奨
 読取専用 

押下されたキーの `keyCode` の数値、または押下された英数字キーの文字コード (`charCode`) を返します。

インスタンスメソッド
----------

*このインターフェイスは、親である `Event` からメソッドを継承しています。*

`UIEvent.initUIEvent()` 
非推奨

`UIEvent` オブジェクトを初期化します。イベントがすでに送出されている場合は、何も行いません。

仕様書
---

| Specification |
| --- |
| UI Events # idl-uievent |

ブラウザーの互換性
---------

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

関連情報
----

* イベント入門
* `Event`
VRPose
======

**非推奨:** この機能は非推奨になりました。まだ対応しているブラウザーがあるかもしれませんが、すでに関連するウェブ標準から削除されているか、削除の手続き中であるか、互換性のためだけに残されている可能性があります。使用を避け、できれば既存のコードは更新してください。このページの下部にある互換性一覧表を見て判断してください。この機能は突然動作しなくなる可能性があることに注意してください。

**非標準:** この機能は標準ではなく、標準化の予定もありません。公開されているウェブサイトには使用しないでください。ユーザーによっては使用できないことがあります。実装ごとに大きな差があることもあり、将来は振る舞いが変わるかもしれません。

**`VRPose`** は WebVR API のインターフェイスで、特定のタイムスタンプにおける VR センサーの状態（向き、位置、速度、加速度の情報を含みます）を示します。

**メモ:** このインターフェイスは古い WebVR API の一部でした。これは WebXR 機器 API に置き換えられました。

このインターフェイスには、 `VRDisplay.getPose()` と `VRDisplay.getFrameData()` メソッドを通じてアクセスします。 `VRDisplay.getPose()` は非推奨です。

プロパティ
-----

`VRPose.position` 
非推奨
 読取専用  
Non-standard

現在の `VRPose.timestamp` における `VRDisplay` の位置を 3D ベクトルとして返します。

`VRPose.linearVelocity` 
非推奨
 読取専用  
Non-standard

現在の `VRPose.timestamp` における `VRDisplay` の（線形の）速度を返します。単位はメートル/秒です。

`VRPose.linearAcceleration` 
非推奨
 読取専用  
Non-standard

現在の `VRPose.timestamp` における `VRDisplay` の（線形の）加速度を返します。単位はメートル/秒/秒です。

`VRPose.orientation` 
非推奨
 読取専用  
Non-standard

現在の `VRPose.timestamp` におけるセンサーの向きをクォータニオン値として返します。

`VRPose.angularVelocity` 
非推奨
 読取専用  
Non-standard

現在の `VRPose.timestamp` における `VRDisplay` の角速度を返します。単位はラジアン/秒です。

`VRPose.angularAcceleration` 
非推奨
 読取専用  
Non-standard

現在の `VRPose.timestamp` における `VRDisplay` の角加速度を返します。単位はラジアン/秒/秒です。

### 廃止されたプロパティ

`VRPose.timeStamp` 
非推奨
 読取専用 

システムの現在の時刻を返します。位置データが更新されたかどうか、またどのような順序で更新が行われたかを判断するのに有益な、単調に増加する値です。**代わりに、タイムスタンプは `VRDisplay.getFrameData()` が呼び出されたときに返されるようになりました（詳細は `VRFrameData.timestamp` を参照）。**

例
-

コード例については `VRFieldOfView` を参照してください。

仕様書
---

このインターフェイスは古い WebVR API の一部であり、これは WebXR 機器 API で置き枯れられました。標準規格になる見込みはありません。

すべてのブラウザーが新しい WebXR API を実装するまで、 A-Frame、Babylon.js、Three.js などのフレームワークを使用するか、ポリフィルを使用することが、すべてのブラウザーで動作する WebXR アプリを開発する上で推奨されます。[1]

ブラウザーの互換性
---------

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

関連情報
----

* WebVR API
AudioWorkletProcessor
=====================

ウェブオーディオ API の **`AudioWorkletProcessor`** インターフェイスは、独自の `AudioWorkletNode` が用いる音声処理コードを表します。これは `AudioWorkletGlobalScope` に存在し、ウェブオーディオレンダリングスレッドで実行されます。一方、対応する `AudioWorkletNode` はメインスレッドで実行されます。

コンストラクター
--------

**メモ:** `AudioWorkletProcessor` とその派生クラスは、ユーザーのコードから直接生成することはできません。これらは対応する `AudioWorkletNode` の生成に伴って内部でのみ生成されます。派生クラスのコンストラクターはオプションオブジェクトとともに呼ばれるため、独自の初期化処理を行うことができます。詳しくはコンストラクターのページを参照してください。

`AudioWorkletProcessor()`

新しい `AudioWorkletProcessor` オブジェクトのインスタンスを生成します。

インスタンスプロパティ
-----------

`port` 読取専用 

処理器と対応する `AudioWorkletNode` の間の双方向通信に用いる `MessagePort` を返します。もう一方の端は、ノードの `port` プロパティから参照できます。

インスタンスメソッド
----------

*`AudioWorkletProcessor` インターフェイスは自身のメソッドを定義していません。しかし、音声ストリームを処理するために呼ばれる `process()` メソッドを定義しなければなりません。*

イベント
----

*`AudioWorkletProcessor` インターフェイスはイベントに反応しません。*

使用上の注意点
-------

### 派生クラスの作成

独自の音声処理コードを定義するには、`AudioWorkletProcessor` インターフェイスの派生クラスを作る必要があります。このインターフェイスでは定義されていませんが、派生クラスには `process` メソッドが必要です。このメソッドは 128 サンプルフレームからなるブロックそれぞれについて呼ばれ、入力の配列、出力の配列、(定義されていれば) 独自の `AudioParam` の計算された値を引数として受け取ります。出力の配列の初期値は無音です。入力と音声パラメーターの値を出力の配列を埋めるのに使用できます。

オプションとして、ノードで独自の `AudioParam` を使いたい場合、処理器の *静的ゲッター* として `parameterDescriptors` プロパティを定義できます。返される `AudioParamDescriptor` (en-US) をベースとするオブジェクトの配列が、`AudioWorkletNode` の生成時に `AudioParam` を生成するため用いられます。

生成された `AudioParam` はノードの `parameters` プロパティに配置され、`linearRampToValueAtTime` などの標準メソッドを用いて自動化できます。これらで計算された値は処理器の `process()` メソッドに渡され、ノードの出力の形成に使用できます。

### 音声処理

以下に、独自の音声処理の仕組みを作るアルゴリズムの例を示します。

1. 別のファイルを作ります。
2. このファイルで以下を行います。
    1. `AudioWorkletProcessor` クラスを継承 (「派生クラスの作成」の節を参照) し、その中で自身の `process()` メソッドを定義します。
    2. 作成した処理器を `AudioWorkletGlobalScope.registerProcessor()` メソッドで登録します。
3. 音声コンテキストの `audioWorklet` プロパティの `addModule()` メソッドで、このファイルを読み込みます。
4. この処理器をベースとする `AudioWorkletNode` を生成します。処理器は `AudioWorkletNode` のコンストラクター内部で生成されます。
5. 生成したノードを他のノードに接続します。
例
-

以下の例では、ホワイトノイズを出力する独自の `AudioWorkletNode` を作成します。

まず、ホワイトノイズを出力する独自の `AudioWorkletProcessor` を定義し、登録する必要があります。これは別のファイルで行うことに注意してください。


```js
// white-noise-processor.js
class WhiteNoiseProcessor extends AudioWorkletProcessor {
  process(inputs, outputs, parameters) {
    const output = outputs[0];
    output.forEach((channel) => {
      for (let i = 0; i < channel.length; i++) {
        channel[i] = Math.random() \* 2 - 1;
      }
    });
    return true;
  }
}

registerProcessor("white-noise-processor", WhiteNoiseProcessor);
```


次に、メインスクリプトで処理器をロードし、処理器の名前を渡して `AudioWorkletNode` のインスタンスを作成し、そのノードを音声グラフに接続します。


```js
const audioContext = new AudioContext();
await audioContext.audioWorklet.addModule("white-noise-processor.js");
const whiteNoiseNode = new AudioWorkletNode(
  audioContext,
  "white-noise-processor",
);
whiteNoiseNode.connect(audioContext.destination);
```

仕様書
---

| Specification |
| --- |
| Web Audio API # AudioWorkletProcessor |

ブラウザーの互換性
---------

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

関連情報
----

* ウェブオーディオ API
* Web Audio API の使用
* AudioWorklet の使用 (en-US)
ProcessingInstruction
=====================

**`ProcessingInstruction`** インターフェイスは処理命令を表します。すなわち、特定のアプリケーションを対象とした埋め込み `Node` を表します。しかし、その命令を理解できないほかのアプリケーションは無視することができます。

**警告:** `ProcessingInstruction` ノードは XML 文書のみが対応しており、 HTML 文書は対応していません。この中では、処理命令はコメントとみなされ、ツリーでは `Comment` オブジェクトとして表現されます。

処理命令は XML 宣言とは異なることがあります。

**メモ:** ユーザー定義の処理命令は "`xml`" で始めることはできません。 `xml` 接頭辞を持つ処理命令のターゲット名は、 XML 仕様書によって特定の標準的な用途のために予約されているからです（例えば、 `<?xml-stylesheet ?>` などを見てください）。

例えば、次のようなものです。


```html
<?xml version="1.0"?>
```


これは `target` が `xml` の処理命令です。

EventTarget

Node

CharacterData

ProcessingInstructionインスタンスプロパティ
-----------

*このインターフェイスは親インターフェイスである `CharacterData`, `Node`, `EventTarget` からプロパティを継承しています。*

`ProcessingInstruction.sheet` 読取専用 

存在すれば、関連付けられた `StyleSheet` オブジェクトを返します。なければ `null` を返します。

`ProcessingInstruction.target` 読取専用 

この命令が対象とするアプリケーションを識別する名前です。

インスタンスメソッド
----------

*このインターフェイスには固有のメソッドはありませんが、親インターフェイスである `CharacterData`, `Node`, `EventTarget` からメソッドを継承しています。*

仕様書
---

| Specification |
| --- |
| DOM Standard # interface-processinginstruction |

ブラウザーの互換性
---------

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

関連情報
----

* document.createProcessingInstruction()
* DOM API
ユーザーエージェントクライアントヒント API
=======================

**Experimental:** **これは実験的な機能です。**  
本番で使用する前にブラウザー互換性一覧表をチェックしてください。

ユーザーエージェントクライアントヒント API (User-Agent Client Hints API) は、クライアントヒントを拡張し、 User-Agent レスポンスおよびリクエストヘッダー、および JavaScript API によってブラウザーとプラットフォーム情報を公開する方法を提供します。

概念と使い方
------

ユーザーエージェント文字列を解釈することは、過去には、ユーザーのブラウザーまたは端末に関する情報を取得するための方法でした。典型的なユーザーエージェント文字列は次の例のようなもので、 Windows 上の Chrome 92 を識別します。
```

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.107 Safari/537.36
```


ユーザーエージェント クライアントヒントは、サーバーが情報の集合をリクエストされるモデルを強制することによって、よりプライバシーを保護した方法でこの情報を提供することを目的としています。何を返すかは、ブラウザーが決定します。この手法は、ユーザーエージェントが、そのようなリクエストからユーザーを特定できるような情報の一部を隠すための設定を提供することができるということです。

何を返すかを決定するために、この API を介してアクセスされる情報は、**低エントロピー**と**高エントロピー**の 2 つのグループに分かれます。低エントロピーヒントは、あまり多くの情報を与えないものであり、 API はリクエストされる度にこれらの情報に簡単にアクセスできるようにしています。高エントロピーヒントは、より多くの情報を提供する可能性があるため、ヒントを提供するかどうかをブラウザーが決定できるような方法で制限されます。この決定はユーザーの環境設定や許可リクエストに基づいて行われることがあります。

### ユーザーエージェントクライアントヒントの用途

想定される用途には、次のようなものがあります。

* ブラウザーにウェブプラットフォームの一部の機能が欠けていることを特定したユーザーに、カスタムメイドのポリフィルを提供する。
* ブラウザーのバグの回避。
* ブラウザー分析の記録。
* ユーザーエージェント情報に基づいてコンテンツを適応させる。
 これには、モバイル端末、特に低消費電力と認識された端末に異なる形でコンテンツを提供することが含まれます。
 また、ユーザーの OS に合わせてインターフェイスのデザインを変更したり、OS 固有のインターフェイスへのリンクを提供したりすることも記載することができます。
* セキュリティ機能として、ユーザーが異なるブラウザーや端末からログインした際に通知する。
* ダウンロードを提供しているサイトで、正しいバイナリー実行ファイルを提供する。
* アプリケーションのエラーを特定するために、ブラウザーや端末に関する情報を収集すること。
* スパマー、ボット、クローラーをブロックする。
インターフェイス
--------

`NavigatorUAData`

ユーザーのブラウザーとオペレーティングシステムに関するデータにアクセスするためのプロパティとメソッドを提供します。

例
-

### ブランドの取得

以下の例は、 `NavigatorUAData.brands` の値をコンソールに表示するものです。


```js
console.log(navigator.userAgentData.brands);
```

### 高いエントロピーの値の返却

以下の例では、 `NavigatorUAData.getHighEntropyValues()` メソッドを使用して多くのヒントがリクエストされます。プロミスが解決すると、この情報がコンソールに表示されます。


```js
navigator.userAgentData
  .getHighEntropyValues([
    "architecture",
    "model",
    "platform",
    "platformVersion",
    "fullVersionList",
  ])
  .then((ua) => {
    console.log(ua);
  });
```

仕様書
---

| Specification |
| --- |
| User-Agent Client Hints # navigatoruadata |

ブラウザーの互換性
---------

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

関連情報
----

* Improving user privacy and developer experience with User-Agent Client Hints
* Migrate to User-Agent Client Hints
MutationEvent
=============

**非推奨:** この機能は非推奨になりました。まだ対応しているブラウザーがあるかもしれませんが、すでに関連するウェブ標準から削除されているか、削除の手続き中であるか、互換性のためだけに残されている可能性があります。使用を避け、できれば既存のコードは更新してください。このページの下部にある互換性一覧表を見て判断してください。この機能は突然動作しなくなる可能性があることに注意してください。

**`MutationEvent`** インターフェイスは、 Document Object Model (DOM) の階層とノードの変更に特化したイベントプロパティを提供します。

**メモ:** mutation イベントを使用するのは問題があります。

* 設計上の欠陥があります。
* 文書に DOM の mutation リスナーを追加すると、その文書に対するその後の DOM 変更のパフォーマンスが著しく低下します（1.5 倍から 7 倍も遅くなります）。さらに、リスナーを削除してもダメージは元に戻りません。
* クロスブラウザー互換性が低いです。 Safari は `DOMAttrModified` に対応しておらず（WebKit のバグ 8191 を参照）、Firefox は mutation name イベント（`DOMElementNameChanged` や `DOMAttributeNameChanged` など）に対応していません。

これらは非推奨になり、変異オブザーバーに置き換えられました。**こちらの使用を検討してください。**

Event

MutationEventインスタンスプロパティ
-----------

*このインターフェイスには親である `UIEvent` と、間接的に `Event` から継承したプロパティがあります。*

`MutationEvent.attrChange` 読取専用  
非推奨

どのような変更が `DOMAttrModified` イベントのトリガーとなったかを示します。これは `MODIFICATION` (`1`)、`ADDITION` (`2`)、`REMOVAL` (`3`)のいずれかです。他のイベントに対しては意味を持たず、 `0` に設定されます。

`MutationEvent.attrName` 読取専用  
非推奨

`DOMAttrModified` イベントの影響を受けるノードの名前を示します。他のイベントでは意味を持たず、空文字列 (`""`) に設定されます。

`MutationEvent.newValue` 読取専用  
非推奨

`DOMAttrModified` イベントでは、変更された `Attr` ノードの新しい値が格納されます。 `DOMCharacterDataModified` イベントでは、変更された `CharacterData` ノードの新しい値を返します。それ以外の場合は、空文字列 (`""`) を返します。

`MutationEvent.prevValue` 読取専用  
非推奨

`DOMAttrModified` イベントでは、変更前の `Attr` ノードの値が格納されます。 `DOMCharacterDataModified` イベントでは、変更された `CharacterData` ノードの新しい値を返します。それ以外の場合は、空文字列 (`""`) を返します。

`MutationEvent.relatedNode` 読取専用  
非推奨

`DOMSubtreeModified` のサブツリー内の変更されたノードのように、イベントに関連するノードを示します。

インスタンスメソッド
----------

`MutationEvent.initMutationEvent()` 
非推奨

コンストラクターメソッドで、与えられた引数で構成された新しい `MutationEvent` を返します。

変異イベント一覧
--------

以下はすべての変異イベントの一覧です。

* `DOMAttrModified` （Safari では未対応）
* `DOMAttributeNameChanged` （Firefox では未対応）
* `DOMCharacterDataModified`
* `DOMElementNameChanged` （Firefox では未対応）
* `DOMNodeInserted`
* `DOMNodeInsertedIntoDocument`
* `DOMNodeRemoved`
* `DOMNodeRemovedFromDocument`
* `DOMSubtreeModified`
例
-

変異イベントのリスナーは、 `EventTarget.addEventListener()` を使って以下のように登録できます。


```js
element.addEventListener(
  "DOMNodeInserted",
  (event) => {
    // …
  },
  false,
);
```

仕様書
---

| Specification |
| --- |
| UI Events # interface-mutationevent |

ブラウザーの互換性
---------

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

関連情報
----

* `MutationObserver`
TimeRanges
==========

**`TimeRanges`** インターフェイスは、主に `<audio>` 要素と `<video>` 要素で使用するためにメディアをロードするときにメディアのどの部分がバッファリングされたかを追跡する目的で、一連の時間範囲を表すために使用します。

`TimeRanges` オブジェクトには、1 つ以上の時間範囲が含まれ、それぞれが開始時間と終了時間のオフセットで指定されます。 各時間範囲を参照するには、`start()` メソッドおよび `end()` メソッドを使用して、取得する時間範囲のインデックス番号を渡します。

「正規化された TimeRanges オブジェクト（英語）」という用語は、そのようなオブジェクトの範囲が順序付けられ、重なり合わず、空ではなく、触れていないことを示します（隣接する範囲は 1 つの大きな範囲に折り畳まれます）。

プロパティ
-----

`TimeRanges.length` 読取専用 

時間範囲オブジェクトによって表される時間範囲の数を `unsigned long` 型で返します。

メソッド
----

`TimeRanges.start()`

指定されたインデックスを持つ範囲の開始時間を返します。

`TimeRanges.end()`

指定された範囲の終了時間を返します。

仕様
--

| Specification |
| --- |
| HTML Standard # time-ranges |

ブラウザーの互換性
---------

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

**`HTMLTableColElement`** インターフェイスは、表の単一またはグループの列要素を操作するプロパティを提供します。

EventTarget

Node

Element

HTMLElement

HTMLTableColElementインスタンスプロパティ
-----------

*親である `HTMLElement` から継承したプロパティもあります。*

`HTMLTableColElement.align` 
非推奨

文字列で、列内のセルデータの水平方向の配置を示します。

`HTMLTableColElement.ch` 
非推奨

文字列で、セルデータの整列文字を表します。

`HTMLTableColElement.chOff` 
非推奨

文字列で、整列文字のオフセットを表します。

`HTMLTableColElement.span`

`unsigned long` で、 HTML の `span` 属性を反映し、このオブジェクトの属性を適用する列の数を示します。正の整数でなければなりません。

`HTMLTableColElement.vAlign` 
非推奨

文字列で、列内のセルデータの垂直方向の配置を示します。

`HTMLTableColElement.width` 
非推奨

文字列で、既定の列の幅を表します。

インスタンスメソッド
----------

*固有のメソッドはありません。親である `HTMLElement` から継承したメソッドがあります。*

仕様書
---

| Specification |
| --- |
| HTML Standard # htmltablecolelement |

ブラウザーの互換性
---------

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

関連情報
----

* このインターフェイスを実装している HTML 要素: `<col>` および `<colgroup>`
CSSFontFaceRule
===============

**`CSSFontFaceRule`** インターフェイスは `@font-face` アットルールを表します。

CSSRule

CSSFontFaceRuleインスタンスプロパティ
-----------

*祖先である `CSSRule` からプロパティを継承しています。*

`CSSFontFaceRule.style` 読取専用 

`CSSStyleDeclaration` を返します。

インスタンスメソッド
----------

*祖先である `CSSRule` からメソッドを継承しています。*

例
-

この例では、 `@font-face` ページに例として挙げられている CSS を使用しています。最初に返される `CSSRule` は `CSSFontFaceRule` になります。


```css
@font-face {
  font-family: MyHelvetica;
  src: local("Helvetica Neue Bold"), local("HelveticaNeue-Bold"),
    url(MgOpenModernaBold.ttf);
  font-weight: bold;
}
```



```js
let myRules = document.styleSheets[0].cssRules;
console.log(myRules[0]); //a CSSFontFaceRule
```

仕様書
---

| Specification |
| --- |
| CSS Fonts Module Level 4 # om-fontface |

ブラウザーの互換性
---------

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

**`HTMLFieldSetElement`** インターフェイスは、（継承により利用できる通常の `HTMLElement` インターフェイスのものに加えて）`<fieldset>` 要素のレイアウトと表示を操作するための特別なプロパティやメソッドを提供します。

EventTarget

Node

Element

HTMLElement

HTMLFieldSetElementインスタンスプロパティ
-----------

*親である `HTMLElement` から継承したプロパティがあります。*

`HTMLFieldSetElement.disabled`

論理値で、 HTML の `disabled` 属性を反映し、ユーザーがこのコントロールを操作できるかどうかを示します。

`HTMLFieldSetElement.elements` 読取専用 

このフィールドセットに所属する要素です。このプロパティの型は、ブラウザーが実装している仕様書のバージョンによって異なります。

`HTMLFieldSetElement.form` 読取専用 

`HTMLFormControlsCollection` または `HTMLCollection` で、この要素がフォーム内にあった場合、含んでいるフォーム要素を参照します。
 このフィールドセットがフォーム要素の子孫でなかった場合は、この属性は関連付けられた同じ文書内の何れかのフォームになるか、一致するものがなければ `null` になります。


`HTMLFieldSetElement.name`

文字列で、 HTML の `name` 属性を反映し、フォームを送信するときに使われるフィールドセットの名前が入ります。

`HTMLFieldSetElement.type` 読取専用 

文字列 "`fieldset`" です。

`HTMLFieldSetElement.validationMessage`

文字列で、（もしあれば）制約検証でコントロールが合格しなかった場合のローカライズされたメッセージを表現します。この属性はコントロールが制約検証の候補にならない場合（`willValidate` が `false` の場合）や、制約を満たしている場合は空文字列になります。

`HTMLFieldSetElement.validity`

`ValidityState` で、この要素がある妥当性の状態を表します。

`HTMLFieldSetElement.willValidate`

論理値 `false` です。`<fieldset>` オブジェクトは制約検証の対象になることがないからです。

インスタンスメソッド
----------

*親である `HTMLElement` から継承したメソッドがあります。*

`HTMLFieldSetElement.checkValidity()`

常に `true` を返します。 `<fieldset>` オブジェクトは制約検証の対象になることがないためです。

`HTMLFieldSetElement.reportValidity()`

常に `true` を返します。 `<fieldset>` オブジェクトは制約検証の対象になることがないためです。

`HTMLFieldSetElement.setCustomValidity()`

独自の検証メッセージをフィールドセットに設定します。メッセージが空文字列でなければ、フィールドセットには独自の検証エラーが発生している状態であり、検証に合格していません。

仕様書
---

| Specification |
| --- |
| HTML Standard # htmlfieldsetelement |

ブラウザーの互換性
---------

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

関連情報
----

* このインターフェイスを実装している HTML 要素: `<fieldset>`
Vibration API
=============

現代のモバイル端末は、たいていバイブレーションハードウェアを内蔵しており、ソフトウェアのコードが端末を振動させることによりユーザーに物理的なフィードバックを与えることができます。 **Vibration API** はウェブアプリに、このハードウェアが存在すればアクセスすることができるようにし、端末が対応していない場合は何もしません。

バイブレーションの表現
-----------

バイブレーションはオン・オフのパルスのパターンで表され、様々な長さになることがあります。パターンは振動するミリ秒数を示す整数 1 つ、あるいはバイブレーションと休止時間のパターンを示す整数の配列で構成します。バイブレーションは `Navigator.vibrate()` という単一のメソッドで制御します。

### 1 回のバイブレーション

1 個の値、または 1 個だけの値で構成される配列を指定することにより、バイブレーションハードウェアを 1 回振動させることができます:


```js
window.navigator.vibrate(200);
window.navigator.vibrate([200]);
```


どちらの例も、デバイスを 200 ミリ秒間振動させます。

### バイブレーションパターン

値の配列は、デバイスが振動する時間と振動しない時間を交互に示します。配列内の各値は整数値に変換されて、デバイスを振動させるミリ秒数および振動させないミリ秒数として交互に解釈されます。例えば以下のようにします。


```js
window.navigator.vibrate([200, 100, 200]);
```


これはデバイスを 200 ミリ秒間振動させて、その後再び 200 ミリ秒間振動させる前に 100 ミリ秒間振動を止めます。

バイブレーション/休止のペアは好きなだけ多く指定でき、またエントリ数は偶数・奇数のどちらでも可能です。各バイブレーション時間の終端で自動的にバイブレーションを止めますので、休止時間を最後のエントリとして与えなくてもよいことは注目に値します。

### 実行中のバイブレーションを取り消す

値 `0`、空の配列、あるいはすべての値が `0` の配列 を指定して `Navigator.vibrate()` を呼び出すと、現在進行中のバイブレーションパターンを取り消します。

### 継続的なバイブレーション

基本的な `setInterval` および `clearInterval` のアクションにより、継続的なバイブレーションを生成できます:


```js
var vibrateInterval;

// 渡されたレベルでバイブレーションを開始
function startVibrate(duration) {
  navigator.vibrate(duration);
}

// バイブレーションを停止
function stopVibrate() {
  // インターバルをクリアして継続的なバイブレーションを停止
  if (vibrateInterval) clearInterval(vibrateInterval);
  navigator.vibrate(0);
}

// 与えられた時間とインターバルによる継続的なバイブレーションを開始
// 数値が与えられるものとする
function startPersistentVibrate(duration, interval) {
  vibrateInterval = setInterval(function () {
    startVibrate(duration);
  }, interval);
}
```


当然ながら、上記のコードスニペットは配列によるバイブレーションを考慮していません。配列に基づく継続的なバイブレーションでは、配列のアイテムの総数を計算して、その値を基にしてインターバル (おそらく、遅延時間を付加して) を作成することが必要でしょう。

仕様書
---

| Specification |
| --- |
| Vibration API (Second Edition) # dom-navigator-vibrate |

ブラウザーの互換性
---------

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

関連情報
----

* `Navigator.vibrate()`