recursal/MDN huggingface dataset:
MIDIOutput: send() メソッド
=======================

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

`MIDIOutput` インターフェイスの **`send()`** メソッドは、対応する MIDI ポートに送信するメッセージをキューに追加します。メッセージはすぐに送信することも、省略可能なタイムスタンプを用いて送信を遅延させることもできます。

構文
--


```js
send(data)
send(data, timestamp)
```

### 引数

`data`

1 個以上の有効な MIDI メッセージの列です。それぞれのエントリーが 1 バイトのデータを表します。

`timestamp` 省略可

ミリ秒単位の時刻を表す `DOMHighResTimestamp` で、メッセージを送信するまでの遅延を表現します。

### 返値

なし (`undefined`)

### 例外

`TypeError`

`data` が有効な列でないか、有効な MIDI メッセージが格納されていないとき投げられます。

`InvalidAccessError` `DOMException`

`data` がシステムエクスクルーシブメッセージで、`MIDIAccess` でシステムエクスクルーシブへのアクセスが有効になっていないとき投げられます。

`InvalidStateError` `DOMException`

ポートが切断されているとき投げられます。

例
-

以下の例では、真ん中のドのノートをすぐに送信し、1 秒後にノートオフメッセージを送信します。


```js
function sendMiddleC(midiAccess, portID) {
  const noteOnMessage = [0x90, 60, 0x7f]; // ノートオン、真ん中のド、フルベロシティー
  const output = midiAccess.outputs.get(portID);
  output.send(noteOnMessage); // タイムスタンプの省略は、すぐに送信することを意味する
  output.send([0x80, 60, 0x40], window.performance.now() + 1000.0); // timestamp = now + 1000ms
}
```

仕様書
---

| Specification |
| --- |
| Web MIDI API # dom-midioutput-send |

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

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

Canvas 2D API の **`Path2D.addPath()`** メソッドは、パスに対して引数でパスを追加します。

構文
--
```

void path.addPath(path [, transform]);
```

### パラメーター

`path`

追加する`Path2D` (en-US)パス

`transform` 省略可

パスに追加する変換マトリックスとして使われる`SVGMatrix`.

例
-

### `addPathメソッドを使用する`

これは`addPathメソッドを使用する簡単なコードスニペットです。`


```js
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");

// rectで新しいパスを作成する
var p1 = new Path2D();
p1.rect(0, 0, 100, 100);

// rectで別のパスを作成する
var p2 = new Path2D();
p2.rect(0, 0, 100, 100);

// 右に縦300ポイント移動する変換マトリックスを作成する
var m = document
  .createElementNS("http://www.w3.org/2000/svg", "svg")
  .createSVGMatrix();
m.a = 1;
m.b = 0;
m.c = 0;
m.d = 1;
m.e = 300;
m.f = 0;

// 2番目のパスを最初のパスに追加する
p1.addPath(p2, m);

// 最後に、1番目のパスをキャンバスに描画する
ctx.fill(p1);
```


以下のコードを編集して、その変更が canvas に反映されることを確かめてください(現在のブラウザーが実際にこのメソッドをサポートしているか、以下のブラウザー互換テーブルをチェックしてください)

仕様
--

| Specification |
| --- |
| HTML Standard # dom-path2d-addpath-dev |

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

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

関連情報
----

* このインターフェイスは`Path2D` (en-US)に定義されています。
Path2D()
========

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

**`Path2D()`** コンストラクターは、新たにインスタンス化した `Path2D` オブジェクトを返します。他のパスを引数に渡すこともできます(複製がつくられます)。また、SVG パス からなるデータを文字列で渡すこともできます。

構文
--
```

new Path2D();
new Path2D(path);
new Path2D(d);
```

### 引数

`path` 省略可

他の`Path2D` オブジェクトを渡して呼び出すと、引数の `path` が複製されます。

`d` 省略可

SVG パス からなる文字列を渡して呼出すと、その内容のパスが新たにつくられます。

例
-

### パスを複製してつくる

これは、`Path2D` のパスを複製して作成する簡単なコードスニペットです。
```

<canvas id="canvas"></canvas>
```



```js
const canvas = document.getElementById("canvas");
const ctx = canvas.getContext("2d");

let path1 = new Path2D();
path1.rect(10, 10, 100, 100);

let path2 = new Path2D(path1);
path2.moveTo(220, 60);
path2.arc(170, 60, 50, 0, 2 \* Math.PI);

ctx.stroke(path2);
```

### SVG パスを使用する

これは、SVG パスデータ を使用して `Path2D` のパスを作成する簡単なコードスニペットです。パスは点 (`M10 10`) に移ってから、水平に 80 ポイント右に移動し (`h 80`)、80 ポイント下がり (`v 80`)、80 ポイント左に移動し (`h -80`)、開始点に戻ります (`z`)。
```

<canvas id="canvas"></canvas>
```



```js
const canvas = document.getElementById("canvas");
const ctx = canvas.getContext("2d");

let p = new Path2D("M10 10 h 80 v 80 h -80 Z");
ctx.fill(p);
```

仕様
--

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

ブラウザー実装状況
---------

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

関連情報
----

* `Path2D` (en-US) インタフェースに、このコンストラクタは属します。
HTMLHtmlElement: version プロパティ
==============================

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

**メモ:** このプロパティは、 HTML 4.01 の W3C 技術勧告で非推奨とされ、文書のバージョン情報を得るためには DTD を使用することが推奨されています。

文書の文書型定義 (DTD) に関するバージョン情報を返します。 Mozilla はこのプロパティを認識しますが、このプロパティの返値は常に空文字列です。

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

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

**`DOMRect()`** コンストラクターは、新しい `DOMRect` オブジェクトを作成します。

構文
--


```js
new DOMRect(x, y, width, height)
```

### 引数

`x`

この `DOMRect` の原点の `x` 座標です。

`y`

この `DOMRect` の原点の `y` 座標です。

`width`

この `DOMRect` の幅です。

`height`

この `DOMRect` の高さです。

### 返値

新しい `DOMRect` オブジェクトです。

仕様書
---

| Specification |
| --- |
| Geometry Interfaces Module Level 1 # dom-domrect-domrect |

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

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

関連情報
----

* `DOMPoint`
* `DOMRect`
* `DOMRect.fromRect()`
DOMRect: fromRect() 静的メソッド
==========================

**`fromRect()`** は `DOMRect` オブジェクトの静的メソッドで、新しい `DOMRect` オブジェクトを指定した位置と寸法で作成します。

構文
--


```js
DOMRect.fromRect()
DOMRect.fromRect(rectangle)
```

### 引数

`rectangle` 省略可

矩形の位置と寸法を指定するオブジェクト。すべてのプロパティは既定で `0` です。プロパティは次の通りです。

* `x`: 矩形の左端の座標です。
* `y`: 矩形の上端の座標です。
* `width`: 矩形の幅です。
* `height`: 矩形の高さです。

### 返値

`DOMRect` のインスタンスです。

仕様書
---

| Specification |
| --- |
| Geometry Interfaces Module Level 1 # dom-domrect-fromrect |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
ByteLengthQueuingStrategy: size() メソッド
======================================

**`size()`** は `ByteLengthQueuingStrategy` インターフェイスのメソッドで、指定されたチャンクの `byteLength` プロパティを返します。

構文
--


```js
size(chunk)
```

### 引数

`chunk`

ストリームを通して渡されるデータのチャンク。

### 返値

指定されたチャンクのバイト長を表す整数です。

例
-


```js
const queuingStrategy = new ByteLengthQueuingStrategy({ highWaterMark: 1 });

const readableStream = new ReadableStream(
  {
    start(controller) {
      // …
    },
    pull(controller) {
      // …
    },
    cancel(err) {
      console.log("stream error:", err);
    },
  },
  queuingStrategy,
);

const size = queueingStrategy.size(chunk);
```

仕様書
---

| Specification |
| --- |
| Streams Standard # blqs-size |

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

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

関連情報
----

* `ByteLengthQueuingStrategy()` コンストラクター
ByteLengthQueuingStrategy: ByteLengthQueuingStrategy() コンストラクター
===============================================================

**`ByteLengthQueuingStrategy()`** コンストラクターは、`ByteLengthQueuingStrategy` オブジェクトのインスタンスを作成して返します。

構文
--


```js
new ByteLengthQueuingStrategy(highWaterMark)
```

### 引数

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

`highWaterMark`

背圧が適用される前に内部キューに格納することができるバイト数の合計です。

`CountQueuingStrategy()` では `highWaterMark` 引数に単純な塊の数を指定しますが、 `ByteLengthQueuingStrategy()` では、 `highWaterMark` 引数はバイト数を指定します。具体的には、チャンクのストリームが指定された場合に、背圧が適用される前に内部キューに何バイト分のチャンクを格納することができるか（チャンクの数ではありません）を指定します。

### 返値

`ByteLengthQueuingStrategy` オブジェクトのインスタンスです。。

### 例外

なし。

例
-


```js
const queuingStrategy = new ByteLengthQueuingStrategy({
  highWaterMark: 1 \* 1024,
});

const readableStream = new ReadableStream(
  {
    start(controller) {
      // …
    },
    pull(controller) {
      // …
    },
    cancel(err) {
      console.log("stream error:", err);
    },
  },
  queuingStrategy,
);

const size = queuingStrategy.size(chunk);
```

仕様書
---

| Specification |
| --- |
| Streams Standard # blqs-constructor |

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

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

関連情報
----

* `ByteLengthQueuingStrategy` インターフェイス
ByteLengthQueuingStrategy: highWaterMark プロパティ
==============================================

**`ByteLengthQueuingStrategy.highWaterMark`** は読み取り専用プロパティで、背圧が適用される前に内部キューに格納することができる総バイト数を返します。

**メモ:** `CountQueuingStrategy()` では `highWaterMark` 引数に単純な塊の数を指定しますが、 `ByteLengthQueuingStrategy()` では、 `highWaterMark` 引数はバイト数を指定します。具体的には、チャンクのストリームが指定された場合に、背圧が適用される前に内部キューに何バイト分のチャンクを格納することができるか（チャンクの数ではありません）を指定します。

値
-

整数です。

例
-


```js
const queuingStrategy = new ByteLengthQueuingStrategy({
  highWaterMark: 1 \* 1024,
});

const readableStream = new ReadableStream(
  {
    start(controller) {
      // …
    },
    pull(controller) {
      // …
    },
    cancel(err) {
      console.log("stream error:", err);
    },
  },
  queuingStrategy,
);

const size = queuingStrategy.size(chunk);
console.log(`highWaterMark value: ${queuingStrategy.highWaterMark}$`);
```

仕様書
---

| Specification |
| --- |
| Streams Standard # ref-for-blqs-high-water-mark① |

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

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

関連情報
----

* `ByteLengthQueuingStrategy()` コンストラクター
Window: getScreenDetails()
==========================

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

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

`Window` インターフェイスの **`getScreenDetails()`** メソッドは、ユーザーのデバイスで利用できるすべての画面の詳細を表す `ScreenDetails` (en-US) オブジェクトインスタンスで満たされる `Promise` (en-US) を返します。

構文
--


```js
getScreenDetails()
```

### 引数

なし。

### 返値

`ScreenDetails` (en-US) オブジェクトインスタンスで満たされる `Promise`。

### 例外

`NotAllowedError` `DOMException`

Permissions-Policy によって Window Management API (en-US) の使用がブロックされている場合、またはユーザーが明示的にブラウザのパーミッションリクエストを拒否した場合にスローされます。

例
-

`getScreenDetails()` が呼び出されると、ユーザーに対してすべてのディスプレイでウィンドウを管理する許可を求めるダイアログが表示されます（この許可の状態は、`window-management` をクエリーするために `Permissions.query()` を使用して確認できます）。許可が与えられた場合、結果として得られる `ScreenDetails` (en-US) オブジェクトには、ユーザーのシステムで利用可能なすべてのスクリーンの詳細が含まれています。

以下の例では、利用可能な各ディスプレイ上でフルサイズのウィンドウが開きます。


```js
const screenDetails = await window.getScreenDetails();

// 端末で使用可能のすべてのスクリーンに対して、フルスクリーンのウィンドウを開きます
for (const screen of screenDetails.screens) {
  window.open(
    "https://example.com",
    "\_blank",
    `left=${screen.availLeft},
 top=${screen.availTop},
 width=${screen.availWidth},
 height=${screen.availHeight}`,
  );
}
```


**メモ:** 完全な例については、マルチウィンドウ学習環境を参照してください(ソースコードも参照してください。)

仕様書
---

| Specification |
| --- |
| Window Management # api-window-getScreenDetails-method |

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

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

関連情報
----

* Window Management API (en-US)
Window.blur()
=============

ウィンドウからフォーカスを外します。

構文
--


```js
blur();
```

### 引数

なし。

### 返値

なし (`undefined`)。

例
-


```js
window.blur();
```

メモ
--

window.blur() メソッドは、プログラム的にユーザーが現在のウィンドウからフォーカスを移した場合に等価です。

仕様書
---

| Specification |
| --- |
| HTML Standard # dom-window-blur |

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

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

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

**`Window.sizeToContent()`** メソッドは、ウィンドウの大きさを内容に合わせて変更します。動作するには、この関数が呼び出された時点で DOM コンテンツの読み込みが完了している必要があります。例えば、`DOMContentLoaded` イベントが発行された後です。

Firefox 20 以降では、ウィンドウの最小サイズを制限することで、ウィンドウが小さすぎてユーザーが操作しづらくなることを防いでいます。

構文
--


```js
sizeToContent();
```

### 引数

なし。

### 返値

なし (`undefined`)。

例
-


```js
window.sizeToContent();
```

仕様書
---

この機能は仕様書に含まれていません。

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

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

関連情報
----

* `Window`
Window: unload イベント
===================

**警告:** 開発者はこのイベントを使用するのを避けてください。下記の「使用上のメモ」を参照してください。

**`unload`** イベントは、文書または子リソースがアンロードされるときに発生します。

以下のイベントの後に発生します。

* `beforeunload` (キャンセル可能なイベント)
* `pagehide`

文書は以下のような状態にあります。

* すべてのリソースがまだ存在する（img、iframe など）
* エンドユーザーから見えるものは何もない
* UI 操作の効果がない（`window.open`, `alert`, `confirm`, など）
* エラーが発生しても、アンロードの処理の流れは停止しない

unload イベントは文書ツリーにも続くことに注意してください。親フレームのアンロードは、子フレームの `unload` の**前**に行われます（以下の例を参照）。

構文
--

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


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

イベント型
-----

一般的な `Event` です。

イベントハンドラーの別名
------------

`Window` インターフェイスに加えて、イベントハンドラープロパティ `onunload` は以下のターゲットでも利用できます。

* `HTMLBodyElement`
* `HTMLFrameSetElement` (en-US)
* `SVGSVGElement` (en-US)
使用上のメモ
------

開発者はこのイベントを使用しないでください。

特にモバイルでは `unload` イベントが確実には発行されません。例えば、次の例では `unload` イベントはまったく発生しません。

1. モバイルユーザーがページにアクセスします。
2. その後、ユーザーが異なるアプリに切り替えます。
3. その後、ユーザーがアプリマネージャーからブラウザーを閉じます。

また、 `unload` イベントは前方/後方キャッシュ (bfcache) と互換性がありません。このイベントを使用している多くのページは、イベントが発生した後はページが存在し続けないことを想定しているからです。これに対抗するため、いくつかのブラウザー（Firefox など）は unload リスナーがある場合、ページを bfcache に配置しませんが、これはパフォーマンスにとって悪いことです。他にも、 Chrome のように、ユーザーが操作しても `unload` を発行しないものもあります。

ユーザーのセッションの終わりを指示するために使用するのに最適なイベントは `visibilitychange` イベントです。 `visibilitychange` に対応していないブラウザーでは、 `pagehide` イベントが次善の選択肢となります。

ページのアンロードイベントを検出する場合は、 `pagehide` イベントを待ち受けするのがベストです。

`unload` イベントに関連する問題についての詳しい情報は、ページライフサイクル API ガイドを参照してください。

例
-


```html
<!doctype html>
<html lang="en-US">
  <head>
    <meta charset="UTF-8" />
    <title>Parent Frame</title>
    <script>
 window.addEventListener("beforeunload", (event) => {
 console.log("I am the 1st one.");
 });
 window.addEventListener("unload", (event) => {
 console.log("I am the 3rd one.");
 });
 </script>
  </head>
  <body>
    <iframe src="child-frame.html"></iframe>
  </body>
</html>
```


`child-frame.html` の内容を以下に示します。


```html
<!doctype html>
<html lang="en-US">
  <head>
    <meta charset="UTF-8" />
    <title>Child Frame</title>
    <script>
 window.addEventListener("beforeunload", (event) => {
 console.log("I am the 2nd one.");
 });
 window.addEventListener("unload", (event) => {
 console.log("I am the 4th and last one…");
 });
 </script>
  </head>
  <body>
    ☻
  </body>
</html>
```


親フレームがアンロードされると、 `console.log()` のメッセージに記述された順序でイベントが発生します。

仕様書
---

| Specification |
| --- |
| HTML Standard # event-unload |
| HTML Standard # handler-window-onunload |

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

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

関連情報
----

* 関連イベント: `DOMContentLoaded`, `readystatechange`, `load`
* Unloading Documents — unload a document
* `visibilitychange` イベント
* Don't lose user and app state, use Page Visibility は、 `beforeunload`/`unload` ではなく、 `visibilitychange` を使用する理由について詳しく説明しています。
* Page Lifecycle API は、ウェブアプリケーションでページのライフサイクル動作を処理するための最善の手法を提供します。
* PageLifecycle.js: ページのライフサイクル動作におけるブラウザー間の不整合に対処する JavaScript ライブラリーです。
* Back/forward cache は前方/後方キャッシュとは何か、そして様々なページライフサイクルイベントに対するその意味について説明しています。
Window.showDirectoryPicker()
============================

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

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

`Window` インターフェイスの **`showDirectoryPicker()`** メソッドは、ユーザーがディレクトリーを選択できるディレクトリーピッカーを表示します。

構文
--


```js
showDirectoryPicker()
```

### 引数

`options` 省略可

以下のオプションを含むオブジェクトです。

`id`

ID を指定することで、ブラウザーは ID ごとに異なるディレクトリーを記憶することができます。他のピッカーで同じ ID を用いると、同じディレクトリーでピッカーが開きます。

`mode`

文字列です。ディレクトリーへの読み取り専用アクセスを表す `"read"` または、読み書きアクセスを表す `"readwrite"` を指定します。デフォルトは `"read"` です。

`startIn`

ダイアログを開く場所を指定する `FileSystemHandle` またはウェルノウンディレクトリー (`"desktop"`、`"documents"`、`"downloads"`、`"music"`、`"pictures"`、`"videos"` のいずれか) です。


### 返値

`FileSystemDirectoryHandle` で解決する `Promise` を返します。

### 例外

`AbortError`

ユーザーが選択せずにプロンプトを閉じた場合や、選択されたものをユーザーエージェントがセンシティブや危険だとみなした場合、投げられます。

セキュリティ
------

ユーザーによる一時的な有効化が必要です。この機能が動作するためには、ユーザーがページまたは UI 要素を操作することが必要です。

例
-

この非同期関数は、ディレクトリーピッカーを表示し、選択されたら `FileSystemDirectoryHandle` を返します。


```js
async function getDir() {
  const dirHandle = await window.showDirectoryPicker();

  // dirHandle を扱うコードを実行する
}
```

仕様書
---

| Specification |
| --- |
| File System Access # api-showdirectorypicker |

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

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

関連情報
----

* File System Access API
* The File System Access API: simplifying access to local files
Window: vrdisplaydeactivate イベント
================================

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

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

**`vrdisplaydeactivate`** は WebVR API のイベントで、 HMD が一定時間使用されないためにスタンバイまたはスリープモードになった場合など、VR ディスプレイを表示することができなくなったときに発行されます。

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

このイベントはキャンセル不可で、バブリングしません。

構文
--

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


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

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

イベント型
-----

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

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

*`VRDisplayEvent` は親オブジェクトである `Event` からプロパティを継承しています。*

`VRDisplayEvent.display` 
非推奨
 読取専用 

このイベントに関連付けられた `VRDisplay` です。

`VRDisplayEvent.reason` 
非推奨
 読取専用 

このイベントが発生した理由を人間可読な形で示します。

例
-

`vrdisplaydeactivate` イベントは `addEventListener` メソッドで使用することができます。


```js
window.addEventListener("vrdisplaydeactivate", () => {
  info.textContent = "Display deactivated.";
  reportDisplays();
});
```


または、 `onvrdisplaydeactivate` イベントハンドラープロパティを使用してください。


```js
window.onvrdisplaydeactivate = () => {
  info.textContent = "Display deactivated.";
  reportDisplays();
};
```

仕様書
---

このイベントは古い 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
window.alert
============

**`Window.alert()`** は、任意のメッセージを含むダイアログを表示し、ユーザーがそのダイアログを閉じるまで待機します。

一部の条件下（ユーザーがタブを切り替えた場合など）では、ブラウザーが実際にダイアログを表示しない場合や、ユーザーがダイアログを閉じるのを待たない場合があります。

構文
--


```js
alert()
alert(message)
```

### パラメーター

`message` 省略可

ダイアログに表示したい文字列、または、文字列に変換されて表示されるオブジェクト。

### 戻り値

なし（`undefined`）

例
-


```js
window.alert("Hello world!");
alert("Hello world!");
```


いずれも、以下のように表示されます。

![黒いダイアログボックス。左上の小さな丸いアイコンに続いて、白い開き括弧と閉じ括弧があり、白いテキスト「JavaScript Application」が含まれています。その下の左側には「Hello world!」という白いテキストがあります。そして、右下には小さな水色のボタンがあります。ボタンのテキストは黒で「OK」です](/ja/docs/Web/API/Window/alert/alerthelloworld.png)

注意事項
----

ダイアログは、ユーザー側からの応答を必要としないメッセージのために使われるべきです。

ダイアログボックスはモーダルウィンドウです。ダイアログボックスを閉じるまで、ユーザーはプログラムの他の部分にアクセスすることができません。このため、ダイアログボックス (もしくは、モーダルウィンドウ) を生成する関数を過度に使用すべきではありません。

仕様
--

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

関連情報
----

* `<dialog>` element
* `confirm`
* `prompt`
window.parent
=============

概要
--

現在のウィンドウ、または、サブフレームの親ウィンドウへの参照を返します。

ウィンドウが親を持たない場合、`parent` プロパティは、それ自身への参照となります。

ウィンドウが `<iframe>` 、`<object>` 、あるいは、`<frame>` で読み込まれた場合、その親ウィンドウは、ウィンドウを埋め込んだ要素が存在するウィンドウとなります。

構文
--
```

parentWindow = window.parent
```

例
-


```js
if (window.parent !== window.top) {
  // 1 段下より深いところ
}
```

仕様
--

* HTML Standard
関連情報
----

* `window.frameElement` - `window` が埋め込まれた（`<iframe>` 要素などの）特定の要素を返す
* `window.top` - 最上位ウィンドウへの参照を返す
window.close
============

**`Window.close()`** メソッドは、現在のウィンドウ、またはそのページ上で呼び出されたウィンドウを閉じます。

このメソッドが許可されるのは、`window.open()` メソッドを用いたスクリプトにより開かれたウィンドウに対する呼び出しのみです。ウィンドウがスクリプトにより開かれたものでない場合、次のようなエラーがコンソールに表示されます: `スクリプトはスクリプトによって開かれたウィンドウ以外を閉じることができません。`

構文
--
```

window.close();
```

例
-

### `window.open()` で開かれたウィンドウを閉じる

この例は、ウィンドウを開くメソッドと、そのウィンドウを閉じるメソッドです。これは、`window.open()` の呼び出しにより開かれたウィンドウを閉じる `Window.close()` の使い方を実演します。


```js
//開いたウィンドウへの参照を保持するグローバル変数
var openedWindow;

function openWindow() {
  openedWindow = window.open("moreinfo.htm");
}

function closeOpenedWindow() {
  openedWindow.close();
}
```

### 現在のウィンドウを閉じる

以前は、`window` **インスタンス**の `close()` を呼び出す代わりに `window` オブジェクトの `close()` メソッドを直接呼び出した場合、ブラウザは、スクリプトで開いたウィンドウであるかどうかに関わらず、最前面のウィンドウを閉じていました。セキュリティ上の理由により、スクリプトにより開いたものでないウィンドウを閉じることは許可されなくなりました (Firefox 46.0.1: スクリプトは、そのスクリプトが開いたものでないウィンドウを閉じることができません)。


```js
function closeCurrentWindow() {
  window.close();
}
```

仕様
--

| Specification |
| --- |
| HTML Standard # dom-window-close-dev |

ブラウザーの実装状況
----------

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

`Window.history` は読み取り専用プロパティで、 `History` オブジェクトへの参照を返します。これはブラウザーの*セッション履歴* (現在のページが読み込まれているタブまたはフレームで訪れたことがあるページ群) を操作するためのインターフェイスを提供します。

詳細や使用例については、ブラウザーの履歴の操作をご覧ください。特に、このページでは `pushState()` メソッドと `replaceState()` メソッドについて、使用する前に気を付けなければならないセキュリティ上の特性を説明しています。

例
-


```js
history.back(); // 戻るボタンを押すのと同等
history.go(-1); // history.back(); と同等
```

注
-

最上位ページにおいて `History` オブジェクトを通してアクセスできるセッション履歴のページリストは、ブラウザーの「戻る」や「次へ」ボタンの隣にあるドロップダウンで確認することができます。

セキュリティ上の理由から、 `History` オブジェクトでは権限のないコードがセッション履歴内の他のページの URL にアクセスすることを禁止していますが、セッション履歴の中を移動することは許可しています。

権限のないコードから、セッション履歴を消去したり、前後への移動を無効にしたりする方法はありません。実現可能な最も近い解決策は、 `location.replace()` メソッドでセッション履歴の現在の項目を指定された URL で置き換えることです。

仕様書
---

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

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

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

**`online`** は `Window` インターフェイスのイベントで、ブラウザーがネットワークにアクセスできるようになり、 `Navigator.onLine` の値が `true` に切り替わると発行されます。

**メモ:** このイベントは、特定のウェブサイトの利用可能性を判断するために使用されるべきではありません。ネットワークの問題やファイアウォールが原因で、そのウェブサイトに到達できない可能性があります。

構文
--

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


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

イベント型
-----

一般的な `Event` です。

イベントハンドラーの別名
------------

`Window` インターフェイスに加え、 `ononline` イベントハンドラープロパティは以下のターゲットでも使用できます。

* `HTMLBodyElement`
* `HTMLFrameSetElement` (en-US)
* `SVGSVGElement` (en-US)
例
-


```js
// addEventListener 版
window.addEventListener("online", (event) => {
  console.log("You are now connected to the network.");
});

// ononline 版
window.ononline = (event) => {
  console.log("You are now connected to the network.");
};
```

仕様書
---

| Specification |
| --- |
| HTML Standard # event-online |
| HTML Standard # handler-window-ononline |

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

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

関連情報
----

* `offline`
Window: blur イベント
=================

**`blur`** イベントは、要素がフォーカスを失ったときに発生します。

`blur` の反対は `focus` です。

|  |  |
| --- | --- |
| バブリング | なし |
| キャンセル | 不可 |
| インターフェイス | `FocusEvent` |
| イベントハンドラープロパティ | `onblur` |
| 同期 / 非同期 | 同期 |
| Composed | はい |

例
-

### ライブデモ

この例ではフォーカスを失ったときに文書の外見を変更します。 `addEventListener()` を使用して `focus` および `blur` イベントを監視します。

#### HTML


```html
<p id="log">Click on this document to give it focus.</p>
```


#### CSS


```css
.paused {
  background: #ddd;
  color: #555;
}
```


#### JavaScript


```js
function pause() {
  document.body.classList.add("paused");
  log.textContent = "FOCUS LOST!";
}

function play() {
  document.body.classList.remove("paused");
  log.textContent =
    "This document has focus. Click outside the document to lose focus.";
}

const log = document.getElementById("log");

window.addEventListener("blur", pause);
window.addEventListener("focus", play);
```


#### 結果

仕様書
---

| Specification |
| --- |
| UI Events # event-type-blur |
| HTML Standard # handler-onblur |

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

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

このイベントが処理されている間、 `Document.activeElement` の値はブラウザーによって異なります (Firefox バグ 452307)。 IE10 はフォーカスが移動する先の要素を設定しますが、 Firefox と Chrome ではふつう、文書の `body` を設定します。

関連情報
----

* 関連イベント: `focus`
* `Element` を対象としたこのイベント: `blur` イベント