recursal/MDN huggingface dataset:
CSSStyleSheet: insertRule() メソッド
================================

**CSSStyleSheet.insertRule()** メソッドは、新しい CSS ルールを現在のスタイルシートに挿入します。

**メモ:** `insertRule()` は `CSSStyleSheet` 専用のメソッドですが、実際にはルールを `CSSStyleSheet.cssRules` に、内部的には `CSSRuleList` に挿入します。

構文
--


```js
insertRule(rule)
insertRule(rule, index)
```

### 引数

`rule`

挿入されるルールが入った文字列です。どのようなルールを挿入するかは、種類によります。

* **ルールセット** の場合、セレクターとスタイル定義です。
* **アットルール** の場合、アットマーク付き識別子とルールの内容です。

`index` 省略可

`stylesheet.cssRules.length` 以下の正の数で、 `CSSStyleSheet.cssRules` の中で新しく挿入されるルールの位置を示します。既定値は `0` です。（古い実装では、これは必須でした。詳しくはブラウザーの互換性を参照してください。）

### 返値

スタイルシートのルールリスト内の、新たに挿入されたルールの位置です。

### 例外

`IndexSizeError` `DOMException`

`index` > `CSSRuleList.length` の場合に発生します。

`HierarchyRequestError` `DOMException`

CSS の制約上、`rule` が `index` `0` に挿入できない場合に発生します。

`SyntaxError` `DOMException`

`rule` 引数に 2 つ以上のルールが与えられた場合に発生します。

`HierarchyRequestError` `DOMException`

スタイルルールの後に `@import` アットルールを挿入しようとした場合に発生します。

`InvalidStateError` `DOMException`

`rule` が `@namespace` であり、ルールリストに `@import` アットルールや `@namespace` アットルール以外のものがあった場合に発生します。

例
-

### 新しいルールの挿入

このスニペットは、新しいルールをスタイルシートの先頭に追加します。


```js
myStyle.insertRule("#blanc { color: white }", 0);
```

### スタイルシートルールを追加する関数


```js
/\*\*
 \* Add a stylesheet rule to the document (it may be better practice
 \* to dynamically change classes, so style information can be kept in
 \* genuine stylesheets and avoid adding extra elements to the DOM).
 \* Note that an array is needed for declarations and rules since ECMAScript does
 \* not guarantee a predictable object iteration order, and since CSS is
 \* order-dependent.
 \* @param {Array} rules Accepts an array of JSON-encoded declarations
 \* @example
addStylesheetRules([
 ['h2', // Also accepts a second argument as an array of arrays instead
 ['color', 'red'],
 ['background-color', 'green', true] // 'true' for !important rules
 ],
 ['.myClass',
 ['background-color', 'yellow']
 ]
]);
\*/
function addStylesheetRules(rules) {
  const styleEl = document.createElement("style");

  // Append <style> element to <head>
  document.head.appendChild(styleEl);

  // Grab style element's sheet
  const styleSheet = styleEl.sheet;

  for (let i = 0; i < rules.length; i++) {
    let j = 1,
      rule = rules[i],
      selector = rule[0],
      propStr = "";
    // If the second argument of a rule is an array of arrays, correct our variables.
    if (Array.isArray(rule[1][0])) {
      rule = rule[1];
      j = 0;
    }

    for (let pl = rule.length; j < pl; j++) {
      const prop = rule[j];
      propStr += `${prop[0]}: ${prop[1]}${prop[2] ? " !important" : ""};\n`;
    }

    // Insert CSS Rule
    styleSheet.insertRule(
      `${selector}{${propStr}}`,
      styleSheet.cssRules.length,
    );
  }
}
```

仕様書
---

| Specification |
| --- |
| CSS Object Model (CSSOM) # dom-cssstylesheet-insertrule |

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

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

関連情報
----

* `CSSStyleSheet.deleteRule`
* Constructable Stylesheets (web.dev)
CSSStyleSheet: replaceSync() メソッド
=================================

**`replaceSync()`** は `CSSStyleSheet` インターフェイスのメソッドで、スタイルシートの内容を渡された内容で同期的に置き換えます。.

`replaceSync()` と `CSSStyleSheet.replace()` の両メソッドは、 `CSSStyleSheet()` コンストラクターで作成されたスタイルシートでのみ使用できます。

構文
--


```js
replaceSync(text)
```

### 引数

`text`

スタイルシートのコンテンツを置き換えるためのスタイルルールを格納した文字列。文字列に解釈可能なルールのリストが入っていない場合、値は空文字列に設定されます。

**メモ:** もし `text` に渡されたルールの中に `@import` ルールでインポートされた外部スタイルシートがあった場合は、それらのルールは除去され、コンソールに警告が出力されます。

### 返値

なし (`undefined`)。

### 例外

`NotAllowedError` `DOMException`

このスタイルシートが `CSSStyleSheet()` コンストラクターを使用して作成されていない場合、または変更不可に設定されている場合に発生します。

例
-

次の例では、新しいスタイルシートを作成し、`replaceSync()` を使って 2 つの CSS ルールを追加しています。


```js
const stylesheet = new CSSStyleSheet();

stylesheet.replaceSync("body { font-size: 1.4em; } p { color: red; }");
```

仕様書
---

| Specification |
| --- |
| CSS Object Model (CSSOM) # dom-cssstylesheet-replacesync |

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

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

関連情報
----

* Constructable Stylesheets (web.dev)
* シャドウ DOM の使用
NDEFReader: scan() メソッド
=======================

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

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

`scan()` は `NDEFReader` インターフェイスのメソッドで、読み取り機器を起動し、 `Promise` を返します。このプロミスは NFC タグの読み取り操作がスケジュールされたときに解決し、ハードウェアや権限のエラーが発生したときは拒否されます。このメソッドは、 "nfc" の権限が事前に許可されていない場合は、許可を問い合わせるプロンプトを起動します。

構文
--


```js
scan(options)
```

### 引数

`options` 省略可

以下のプロパティを持つオブジェクトです。

`signal`

`AbortSignal` で、これによってこの `scan()` 操作をキャンセルすることができます。


### 返値

`Promise` で、 NFC アダプターで読み取り操作のスケジューリングが終わると直ちに解決します。

例外
--

このメソッドからは例外は発生しません。代わりに返されるプロミスが拒否され、 `DOMException` が `name` を何れかの一つとして渡されます。

`AbortError`

`options` 引数で渡された `AbortSignal` によってスキャン操作が中止された場合に返されます。

`InvalidStateError` `DOMException`

既に進行中のスキャンがある場合に返されます。

`NotAllowedError`

この操作の権限が拒否された場合に返されます。

`NotSupportedError`

ウェブ NFC と互換性のある NFC アダプターがない、または接続が確立できなかった場合に返されます。

例
-

### スキャン中のエラーの取り扱い

この例では、スキャンのプロミスが拒否され、 `readingerror` が発生したときの様子を示しています。


```js
const ndef = new NDEFReader();
ndef
  .scan()
  .then(() => {
    console.log("Scan started successfully.");
    ndef.onreadingerror = (event) => {
      console.log(
        "Error! Cannot read data from the NFC tag. Try a different one?",
      );
    };
    ndef.onreading = (event) => {
      console.log("NDEF message read.");
    };
  })
  .catch((error) => {
    console.log(`Error! Scan failed to start: ${error}.`);
  });
```

仕様書
---

| Specification |
| --- |
| Web NFC API # dom-ndefreader-scan |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
NDEFReader: NDEFReader() コンストラクター
=================================

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

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

**`NDEFReader()`** は `NDEFReader` インターフェイスのコンストラクターで、新しい `NDEFReader` オブジェクトを返します。これはリーダーの磁気誘導範囲にある互換性のある NFC 機器、例えば NDEF タグからの NDEF メッセージを読み取るのに使用されます。
 field.

構文
--


```js
new NDEFReader()
```

### 引数

なし。

### 返値

新しい `NDEFReader` オブジェクト。

仕様書
---

| Specification |
| --- |
| Web NFC API # dom-ndefreader-constructor |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
NDEFReader: readingerror イベント
=============================

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

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

`readingerror` は `NDEFReader` インターフェイスのイベントで、 NFC タグの読み取りの際にエラーが発生するたびに発行されます。例えば、タグがリーダーの磁気誘導範囲から離れたときです。

構文
--

このイベント名を `addEventListener()` などのメソッドで使用するか、イベントハンドラープロパティを使用するかしてください。


```js
addEventListener("readingerror", (event) => {});

onreadingerror = (event) => {};
```

イベント型
-----

一般的な `Event` です。

例
-

次の例は、 `onreading` と `onreadingerror` の両方のイベントハンドラーを使用してイベントを処理する方法を示しています。


```js
const ndef = new NDEFReader();
ndef
  .scan()
  .then(() => {
    console.log("Scan started successfully.");
    ndef.onreadingerror = (event) => {
      console.log(
        "Error! Cannot read data from the NFC tag. Try a different one?",
      );
    };
    ndef.onreading = (event) => {
      console.log("NDEF message read.");
    };
  })
  .catch((error) => {
    console.log(`Error! Scan failed to start: ${error}.`);
  });
```

仕様書
---

| Specification |
| --- |
| Web NFC API # dom-ndefreader-onreadingerror |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
NDEFReader: reading イベント
========================

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

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

`reading` は `NDEFReader` インターフェイスのイベントで、タグがリーダーの磁気誘導範囲に入り、互換性のある NFC 機器（例えば NDEF に対応している NFC タグ）からの読み取りが可能になるたびに発行されます。

構文
--

このイベント名を `addEventListener()` などのメソッドで使用するか、イベントハンドラープロパティを使用するかしてください。


```js
addEventListener("reading", (event) => {});

onreading = (event) => {};
```

イベント型
-----

一般的な `Event` です。

例
-

次の例は、 `onreading` と `onreadingerror` の両方のイベントハンドラーを使用してイベントを処理する方法を示しています。


```js
const ndef = new NDEFReader();
ndef
  .scan()
  .then(() => {
    console.log("Scan started successfully.");
    ndef.onreadingerror = (event) => {
      console.log(
        "Error! Cannot read data from the NFC tag. Try a different one?",
      );
    };
    ndef.onreading = (event) => {
      console.log("NDEF message read.");
    };
  })
  .catch((error) => {
    console.log(`Error! Scan failed to start: ${error}.`);
  });
```

仕様書
---

| Specification |
| --- |
| Web NFC API # dom-ndefreader-onreading |

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

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

関連情報
----

* `NDEFReader.readingerror_event`
HIDDevice.forget()
==================

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

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

`HIDDevice` インターフェイスの **`forget()`** メソッドは、HID デバイスとの接続を閉じ、デバイスを忘れます。

構文
--


```js
forget()
```

### 引数

なし。

### 返値

接続が閉じられ、デバイスが忘れられ、許可がリセットされた後 `undefined` で解決する `Promise` を返します。

例
-

この例では、Nintendo Switch Joy-Con Right HID デバイスに接続し、1 回点滅させ、切断します。


```js
async function blink() {
  const devices = await navigator.hid.requestDevice({
    filters: [
      {
        vendorId: 0x057e, // Nintendo Co., Ltd
        productId: 0x2007, // Joy-Con Right
      },
    ],
  });
  const device = devices[0];
  await device.open();
  // 消灯させます
  await device.sendFeatureReport(reportId, Uint32Array.from([0, 0]));
  await waitFor(100);
  // 点灯させます
  await device.sendFeatureReport(reportId, Uint32Array.from([512, 0]));
  await new Promise((resolve) => setTimeout(resolve, 100));
  // 最後に、切断します
  await device.forget();
}
blink();
```

仕様書
---

| Specification |
| --- |
| WebHID API # dom-hiddevice-forget |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HIDDevice.open()
================

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

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

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

`HIDDevice` の **`open()`** メソッドは、オペレーティングシステムに HID デバイスを開くことを要求します。

**メモ:** HID デバイスは自動では開かれません。そのため、`HID.requestDevice()` から返された `HIDDevice` でデータの転送を可能にするには、このメソッドを用いて開く必要があります。

構文
--


```js
open()
```

### 引数

なし。

### 返値

接続が開かれたら `undefined` で解決する `Promise` を返します。

### 例外

`InvalidStateError` `DOMException`

接続が既に開かれているとき投げられます。

`NotAllowedError` `DOMException`

何らかの理由により接続を開くのに失敗したとき投げられます。

例
-

この例では、データの送受信を試みる前に HID 接続を開くのを待ちます。


```js
await device.open();
```

仕様書
---

| Specification |
| --- |
| WebHID API # dom-hiddevice-open |

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

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

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

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

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

`HIDDevice` インターフェイスの読み取り専用プロパティ **`productName`** は、接続された HID デバイスの製品名を返します。

値
-

文字列です。

例
-

この例では、`HID.getDevices()` でデバイスを取得し、`productName` の値をコンソールに出力します。


```js
document.addEventListener("DOMContentLoaded", async () => {
  let devices = await navigator.hid.getDevices();
  devices.forEach((device) => {
    console.log(`HID: ${device.productName}`);
  });
});
```

仕様書
---

| Specification |
| --- |
| WebHID API # dom-hiddevice-productname |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HIDDevice.sendFeatureReport()
=============================

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

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

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

`HIDDevice` インターフェイスの **`sendFeatureReport()`** メソッドは、HID デバイスに Feature レポートを送信します。Feature レポートは、HID デバイスとアプリケーションが標準化されていない HID データを交換するための方法です。

各レポート形式用にデバイスがサポートしている `reportId` は、`HIDDevice.collections` から取得できます。

構文
--


```js
sendFeatureReport(reportId, data)
```

### 引数

`reportId`

8 ビットのレポート ID です。HID デバイスがレポート ID を使わない場合、`0` を送信します。

`data`

`ArrayBuffer`, `TypedArray`, `DataView` のいずれかで表されるバイト列です。

### 返値

レポートの送信完了後 `undefined` で解決する `Promise` を返します。

### 例外

`NotAllowedError` `DOMException`

何らかの理由でレポートの送信に失敗したとき投げられます。

例
-

この例では、`sendFeatureReport()` によりデバイスを点滅させます。記事 Connecting to uncommon HID devices で他の例や動くデモを見ることができます。


```js
const reportId = 1;
for (let i = 0; i < 10; i++) {
  // 消灯させます
  await device.sendFeatureReport(reportId, Uint32Array.from([0, 0]));
  await waitFor(100);
  // 点灯させます
  await device.sendFeatureReport(reportId, Uint32Array.from([512, 0]));
  await waitFor(100);
}
```

仕様書
---

| Specification |
| --- |
| WebHID API # dom-hiddevice-sendfeaturereport |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HIDDevice.sendReport()
======================

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

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

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

`HIDDevice` インターフェイスの **`sendReport()`** メソッドは、Output レポートを HID デバイスに送信します。

各レポート形式用にデバイスがサポートしている `reportId` は、`HIDDevice.collections` から取得できます。

構文
--


```js
sendReport(reportId, data)
```

### 引数

`reportId`

8 ビットのレポート ID です。HID デバイスがレポート ID を使わない場合、`0` を送信します。

`data`

`ArrayBuffer`, `TypedArray`, `DataView` のいずれかで表されるバイト列です。

### 返値

レポートの送信完了後 `undefined` で解決する `Promise` を返します。

### 例外

`NotAllowedError` `DOMException`

何らかの理由でレポートの送信に失敗したとき投げられます。

例
-

この例は、Output レポートを用いて Joy-Con デバイスを鳴らす方法を示します。記事 Connecting to uncommon HID devices で他の例や動くデモを見ることができます。


```js
// まず、振動を有効化するコマンドを送信します。
// 魔法のバイト列の出典は https://github.com/mzyy94/joycon-toolweb です。
const enableVibrationData = [1, 0, 1, 64, 64, 0, 1, 64, 64, 0x48, 0x01];
await device.sendReport(0x01, new Uint8Array(enableVibrationData));

// 次に、Joy-Con デバイスを鳴らすコマンドを送信します。
// 実際のバイト列はサンプル中にあります。
const rumbleData = [
  /\* … \*/
];
await device.sendReport(0x10, new Uint8Array(rumbleData));
```

仕様書
---

| Specification |
| --- |
| WebHID API # dom-hiddevice-sendreport |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HIDDevice: inputreport イベント
===========================

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

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

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

`HIDDevice` インターフェイスの **`inputreport`** イベントは、HID デバイスから新しいレポートを受信した時に発火します。

構文
--

`addEventListener()` のようなメソッドでイベント名を使うか、イベントハンドラープロパティを設定します。


```js
addEventListener("inputreport", (event) => {});

oninputreport = (event) => {};
```

イベント型
-----

`HIDInputReportEvent` です。`Event` を継承しています。

Event

HIDInputReportEventイベントプロパティ
---------

*このインターフェイスは、`Event` から継承したプロパティも持ちます。*

`HIDInputReportEvent.data` 読取専用 

Input レポートから読み取ったデータが入った `DataView` です。HID インターフェイスがレポート ID を用いている場合、`reportId` は含まれません。

`HIDInputReportEvent.device` 読取専用 

この Input レポートを送信した HID インターフェイスを表す `HIDDevice` のインスタンスです。

`HIDInputReportEvent.reportId` 読取専用 

レポートを識別する 1 バイトの接頭辞、もしくは HID インターフェイスがレポート ID を用いていない場合 0 です。

例
-

この例では、アプリケーションが Joy-Con Right デバイスでどのボタンが押されたかを検出するために `inputReport` イベントを監視する方法を示します。記事 Connecting to uncommon HID devices で他の例や動くデモを見ることができます。


```js
device.addEventListener("inputreport", (event) => {
  const { data, device, reportId } = event;

  // Joy-Con Right デバイスで、かつ特定のレポート ID のイベントのみを扱います。
  if (device.productId !== 0x2007 && reportId !== 0x3f) return;

  const value = data.getUint8(0);
  if (value === 0) return;

  const someButtons = { 1: "A", 2: "X", 4: "B", 8: "Y" };
  console.log(`ユーザーがボタン ${someButtons[value]} を押しました。`);
});
```

仕様書
---

| Specification |
| --- |
| WebHID API # dom-hiddevice-oninputreport |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HIDDevice.close()
=================

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

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

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

`HIDDevice` インターフェイスの **`close()`** メソッドは、HID デバイスとの接続を閉じます。

構文
--


```js
close()
```

### 引数

なし。

### 返値

接続が閉じられたら `undefined` で解決する `Promise` を返します。

例
-

この例では、全てのデータの送受信が完了した後、HID デバイスを閉じます。


```js
await device.close();
```

仕様書
---

| Specification |
| --- |
| WebHID API # dom-hiddevice-close |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HIDDevice.receiveFeatureReport()
================================

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

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

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

`HIDDevice` インターフェイスの **`receiveFeatureReport()`** メソッドは、HID レポートから Feature レポートを受信します。Feature レポートは、HID デバイスとアプリケーションが標準化されていない HID データを交換するための方法です。

各レポート形式用にデバイスがサポートしている `reportId` は、`HIDDevice.collections` から取得できます。

構文
--


```js
receiveFeatureReport(reportId)
```

### 引数

`reportId`

8 ビットのレポート ID です。HID デバイスがレポート ID を使わない場合、`0` を送信します。

### 返値

Feature レポートが入った `DataView` オブジェクトで解決する `Promise` を返します。

### 例外

`NotAllowedError` `DOMException`

何らかの理由でレポートの受信に失敗したとき投げられます。

例
-

この例では、`reportId` の値 `1` を用いてデバイスからレポートを受信します。


```js
const dataView = await device.receiveFeatureReport(1);
```

仕様書
---

| Specification |
| --- |
| WebHID API # dom-hiddevice-receivefeaturereport |

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

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

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

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

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

`HIDDevice` インターフェイスの読み取り専用プロパティ **`opened`** は、`HIDDevice` への接続が開かれていてデータを転送する準備ができているとき `true` を返します。

値
-

`boolean` 値です。接続が開かれているとき `true` です。

例
-

この例では、`HID.getDevices()` でデバイスを取得し、`opened` の値をコンソールに出力します。


```js
document.addEventListener("DOMContentLoaded", async () => {
  let devices = await navigator.hid.getDevices();
  devices.forEach((device) => {
    console.log(`HID: ${device.opened}`);
  });
});
```

仕様書
---

| Specification |
| --- |
| WebHID API # dom-hiddevice-opened |

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

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

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

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

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

`HIDDevice` インターフェイスの読み取り専用プロパティ **`collections`** は、レポート形式の配列を返します。

値
-

レポート形式の配列です。各エントリーは以下を含みます。

`usagePage`

このコレクションに紐づいた HID 使用法の Usage Page 部分を表す整数です。トップレベルのコレクションの使用法は、デバイスの種類を特定するために使用されます。

標準の HID 使用法の値は、HID Usage Tables に載っています。

`usage`

このコレクションに紐づいた HID 使用法の Usage ID 部分を表す整数です。

`type`

コレクションの種類を表す 8 ビットの値です。グループ化されたアイテムの関係を表します。以下のいずれかです。

`0x00`

Physical (軸のグループ)

`0x01`

Application (マウス、キーボード)

`0x02`

Logical (関連するデータ)

`0x03`

Report

`0x04`

Named array

`0x05`

Usage switch

`0x06`

Usage modified

`0x07 to 0x7F`

将来のために予約

`0x80 to 0xFF`

ベンダー定義

これらの種類についての追加情報は、Device Class Definition に載っています。

`children`

トップレベルコレクションと同じ形式の、サブコレクションの配列です。

`inputReports`

このコレクションで記述されているそれぞれの Input レポートを表す `inputReport` の配列です。

`outputReports`

このコレクションで記述されているそれぞれの Output レポートを表す `outputReport` の配列です。

`featureReports`

このコレクションで記述されているそれぞれの Feature レポートを表す `featureReport` の配列です。

例
-

この例は、`collections` プロパティが返された後、様々な要素にアクセスする方法を示しています。他の例や動くデモを記事 Connecting to uncommon HID devices で見ることができます。


```js
for (const collection of device.collections) {
  // HID コレクションには、使用法、Usage Page、レポート、サブコレクションが含まれます。
  console.log(`Usage: ${collection.usage}`);
  console.log(`Usage page: ${collection.usagePage}`);

  for (const inputReport of collection.inputReports) {
    console.log(`Input report: ${inputReport.reportId}`);
    // inputReport.items をループで走査します
  }

  for (const outputReport of collection.outputReports) {
    console.log(`Output report: ${outputReport.reportId}`);
    // outputReport.items をループで走査します
  }

  for (const featureReport of collection.featureReports) {
    console.log(`Feature report: ${featureReport.reportId}`);
    // featureReport.items をループで走査します
  }

  // collection.children を用いてサブコレクションをループで走査します
}
```

仕様書
---

| Specification |
| --- |
| WebHID API # dom-hiddevice-collections |

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

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

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

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

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

`HIDDevice` インターフェイスの読み取り専用プロパティ **`vendorId`** は、接続された HID デバイスのベンダー ID を返します。これにより、デバイスの製造元を識別します。

値
-

整数です。デバイスにベンダー ID が無いか、ベンダー ID にアクセスできないときは、`0` を返します。

例
-

この例では、`HID.getDevices()` でデバイスを取得し、`vendorId` の値をコンソールに出力します。


```js
document.addEventListener("DOMContentLoaded", async () => {
  let devices = await navigator.hid.getDevices();
  devices.forEach((device) => {
    console.log(`HID: ${device.vendorId}`);
  });
});
```

仕様書
---

| Specification |
| --- |
| WebHID API # dom-hiddevice-vendorid |

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

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