+---

+title: Document.getAnimations()

+slug: Web/API/Document/getAnimations

+tags:

+ - API

+ - Animation

+ - CSS

+ - CSS Animations

+ - CSS Transitions

+ - Document

+ - Experimental

+ - Method

+ - Reference

+ - Transitions

+ - Web Animations

+ - getAnimations

+ - waapi

+ - web animations api

+translation_of: Web/API/DocumentOrShadowRoot/getAnimations

+original_slug: Web/API/DocumentOrShadowRoot/getAnimations

+---

+<p>{{ SeeCompatTable() }}{{APIRef("Web Animations")}}</p>

+

+<p><code>getAnimations()</code> メソッドは {{domxref("Document")}} インターフェイスのメソッドで、この文書の配下にあるターゲット要素にあるすべての {{domxref("Animation")}} オブジェクトの配列を返します。この配列には <a href="/ja/docs/Web/CSS/CSS_Animations">CSS アニメーション</a>, <a href="/ja/docs/Web/CSS/CSS_Transitions">CSS トランジション</a>, <a href="/ja/docs/Web/API/Web_Animations_API">ウェブアニメーション</a> が含まれます。</p>

+

+<h2 id="Syntax" name="Syntax">構文</h2>

+

+<pre class="syntaxbox notranslate">var <var>allAnimations</var> = <var>Document</var>.getAnimations();

+</pre>

+

+<h3 id="Parameters" name="Parameters">引数</h3>

+

+<p>なし。</p>

+

+<h3 id="Return_value" name="Return_value">返値</h3>

+

+<p>{{domxref("Animation")}} オブジェクトの {{jsxref("Array")}} で、それぞれの要素は呼び出された {{domxref("Document")}} の配下にある要素に現在関連付けられているアニメーション1つを表します。</p>

+

+<h2 id="Examples" name="Examples">例</h2>

+

+<p>次のコードスニペットは、ページ上のすべてのアニメーションの {{domxref("Animation.playbackRate")}} を半分にすることで速度をゆっくりにします。</p>

+

+<pre class="brush: js notranslate">document.getAnimations().forEach(

+ function (animation) {

+ animation.playbackRate *= .5;

+ }

+);</pre>

+

+<h2 id="Specifications" name="Specifications">仕様書</h2>

+

+<table class="standard-table">

+ <thead>

+ <tr>

+ <th scope="col">仕様書</th>

+ <th scope="col">状態</th>

+ <th scope="col">備考</th>

+ </tr>

+ </thead>

+ <tbody>

+ <tr>

+ <td>{{SpecName('Web Animations', '#dom-documentorshadowroot-getanimations', 'document.getAnimations()' )}}</td>

+ <td>{{Spec2('Web Animations')}}</td>

+ <td></td>

+ </tr>

+ </tbody>

+</table>

+

+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>

+

+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>

+

+<p>{{Compat("api.Document.getAnimations")}}</p>

+

+<h2 id="See_also" name="See_also">関連情報</h2>

+

+<ul>

+ <li><a href="/ja/docs/Web/API/Web_Animations_API">ウェブアニメーション API</a></li>

+ <li><a href="/ja/docs/Web/CSS/CSS_Animations">CSS アニメーション</a></li>

+ <li><a href="/ja/docs/Web/CSS/CSS_Transitions">CSS トランジション</a></li>

+ <li>{{domxref("Element.getAnimations()")}} - 単一の要素 ({{domxref("Element")}}) とその子孫にあるアニメーションのみを読み取る</li>

+ <li>{{domxref("Animation")}}</li>

+</ul>

+---

+title: DocumentOrShadowRoot.getSelection()

+slug: Web/API/Document/getSelection

+tags:

+ - API

+ - DocumentOrShadowRoot

+ - Doument

+ - Method

+ - Reference

+ - ShadowRoot

+ - getSelection

+ - getSelection()

+ - shadow dom

+translation_of: Web/API/DocumentOrShadowRoot/getSelection

+original_slug: Web/API/DocumentOrShadowRoot/getSelection

+---

+<div>{{APIRef("DOM")}}{{SeeCompatTable}}</div>

+

+<p><span class="seoSummary"><strong><code>getSelection()</code></strong> は {{DOMxRef("DocumentOrShadowRoot")}} インターフェイスのプロパティで、ユーザーが選択したテキストの範囲、またはキャレットの現在位置を表す {{DOMxRef("Selection")}} オブジェクトを返します。</span></p>

+

+<h2 id="Syntax" name="Syntax">構文</h2>

+

+<pre class="syntaxbox">var selection = documentOrShadowRootInstance.getSelection()</pre>

+

+<h3 id="Parameters" name="Parameters">引数</h3>

+

+<p>なし。</p>

+

+<h3 id="Returns" name="Returns">返値</h3>

+

+<p>{{DOMxRef("Selection")}} オブジェクト。</p>

+

+<h2 id="Example" name="Example">例</h2>

+

+<pre class="brush:js">function foo() {

+ var selObj = document.getSelection();

+ alert(selObj);

+ var selRange = selObj.getRangeAt(0);

+ // do stuff with the range

+}</pre>

+

+<h2 id="Notes" name="Notes">メモ</h2>

+

+<h3 id="String_representation_of_the_Selection_object" name="String_representation_of_the_Selection_object">Selection オブジェクトの文字列表現</h3>

+

+<p>JavaScript では、オブジェクトが string を取る関数 ({{DOMxRef("Window.alert()")}} など) に渡された場合、オブジェクトの {{JSxRef("Object.toString", "toString()")}} メソッドが呼び出され、関数にその返値が渡されます。これにより、プロパティやメソッドを持つ実際のオブジェクトであった場合、他の関数に使われると文字列になって現れることがあります。</p>

+

+<p>上記の例では、 <code>selObj.toString()</code> が呼び出されてから {{DOMxRef("Window.alert()")}} に渡されます。しかし、 JavaScript の <a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/String" title="JS/String">String</a> のプロパティやメソッド、例えば <code><a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/String/length" title="JS/String.length">length</a></code> や <code><a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/String/substr" title="JS/String.substr">substr</a></code> が {{DOMxRef("Selection")}} オブジェクトに対して呼び出されると、そのプロパティやメソッドを持っていないため、エラーが発生するか予期しない結果が返ることがあります。 <code>Selection</code> オブジェクトを文字列として扱うには、 <code>toString()</code> メソッドを直接呼び出してください。</p>

+

+<pre class="brush:js;gutter:false;">var selectedText = selObj.toString();</pre>

+

+<ul>

+ <li><code>selObj</code> は <code>Selection</code> オブジェクトです。</li>

+ <li><code>selectedText</code> は文字列 (選択中のテキスト) です。</li>

+</ul>

+

+<h3 id="Related_objects" name="Related_objects">関連するオブジェクト</h3>

+

+<p>{{domxref("Window.getSelection()")}} を呼び出すと、 <code>Document.getSelection()</code> と同等の動作をします。</p>

+

+<p>Firefox において現在は <code>getSelection()</code> は {{htmlelement("input")}} 要素の中では動作しないことに注意してください。 {{domxref("HTMLInputElement.setSelectionRange()")}}) を使用することで回避できます。</p>

+

+<p><em>selection</em> と <em>focus</em> との違いにも注意してください。 {{domxref("Document.activeElement")}} はフォーカスを持つ要素を返します。</p>

+

+<h2 id="Specifications" name="Specifications">仕様書</h2>

+

+<table class="standard-table">

+ <tbody>

+ <tr>

+ <th scope="col">仕様書</th>

+ <th scope="col">状態</th>

+ <th scope="col">備考</th>

+ </tr>

+ <tr>

+ <td>{{SpecName("Shadow DOM", "#extensions-to-the-documentorshadowroot-mixin", "DocumentOrShadowRoot")}}</td>

+ <td>{{Spec2("Shadow DOM")}}</td>

+ <td>初回定義</td>

+ </tr>

+ </tbody>

+</table>

+

+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>

+

+<div>

+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>

+

+<p>{{Compat("api.DocumentOrShadowRoot.getSelection")}}</p>

+</div>

+---

+title: DocumentOrShadowRoot.pointerLockElement

+slug: Web/API/Document/pointerLockElement

+tags:

+ - API

+ - DOM

+ - Document

+ - Property

+ - Reference

+ - ShadowRoot

+ - mouse lock

+ - プロパティ

+ - マウスロック

+translation_of: Web/API/DocumentOrShadowRoot/pointerLockElement

+original_slug: Web/API/DocumentOrShadowRoot/pointerLockElement

+---

+<div>{{APIRef("DOM")}}</div>

+

+<p><span class="seoSummary"><strong><code>pointerLockElement</code></strong> は {{domxref("Document")}} および {{domxref("ShadowRoot")}} インターフェイスのプロパティで、要素をポインターがロックされている間のマウスイベントの対象として設定します。ロック待ち状態の場合、ポインターがロックされていない場合、対象が他の文書にある場合は <code>null</code> になります。</span></p>

+

+<h2 id="Syntax" name="Syntax">構文</h2>

+

+<pre class="syntaxbox">var <var>element</var> = <var>document</var>.pointerLockElement;

+</pre>

+

+<h3 id="Return_value" name="Return_value">返値</h3>

+

+<p>{{domxref("Element")}} または <code>null</code>。</p>

+

+<h2 id="Specifications" name="Specifications">仕様書</h2>

+

+<table class="standard-table">

+ <thead>

+ <tr>

+ <th scope="col">仕様書</th>

+ <th scope="col">状態</th>

+ <th scope="col">備考</th>

+ </tr>

+ </thead>

+ <tbody>

+ <tr>

+ <td>{{SpecName('Pointer Lock','#extensions-to-the-documentorshadowroot-mixin','pointerLockElement')}}</td>

+ <td>{{Spec2('Pointer Lock')}}</td>

+ <td><code>Document</code> インターフェイスを拡張</td>

+ </tr>

+ </tbody>

+</table>

+

+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>

+

+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>

+

+<p>{{Compat("api.DocumentOrShadowRoot.pointerLockElement")}}</p>

+

+<h2 id="See_also" name="See_also">関連情報</h2>

+

+<ul>

+ <li>{{ domxref("Document.exitPointerLock()") }}</li>

+ <li>{{ domxref("Element.requestPointerLock()") }}</li>

+ <li><a href="/ja/docs/WebAPI/Pointer_Lock">Pointer Lock</a></li>

+</ul>

+---

+title: DocumentOrShadowRoot.styleSheets

+slug: Web/API/Document/styleSheets

+tags:

+ - API

+ - Document

+ - DocumentOrShadowRoot

+ - Property

+ - Reference

+ - ShadowRoot

+ - Stylesheets

+ - shadow dom

+translation_of: Web/API/DocumentOrShadowRoot/styleSheets

+original_slug: Web/API/DocumentOrShadowRoot/styleSheets

+---

+<div>{{SeeCompatTable}}{{APIRef("Shadow DOM")}}</div>

+

+<p><span class="seoSummary">{{domxref("DocumentOrShadowRoot")}} インターフェイスの <strong><code>styleSheets</code></strong> 読み取り専用プロパティは、 {{domxref('CSSStyleSheet')}} オブジェクトの {{domxref('StyleSheetList')}} を返します。ドキュメントに明示的にリンクまたは埋め込まれたスタイルシートの場合。</span></p>

+

+<h2 id="例">例</h2>

+

+<pre class="brush: js notranslate">function getStyleSheet(unique_title) {

+ for (var i=0; i&lt;document.styleSheets.length; i++) {

+ var sheet = document.styleSheets[i];

+ if (sheet.title == unique_title) {

+ return sheet;

+ }

+ }

+}

+</pre>

+

+<h3 id="Notes">Notes</h3>

+

+<p>返されるリストは次の順序で並べられます:</p>

+

+<ul>

+ <li>{{htmlelement("link")}} ヘッダから取得したスタイルシートが最初に配置され、ヘッダ順に並べ替えられます。</li>

+ <li>DOM から取得したスタイルシートは、<a href="https://dom.spec.whatwg.org/#concept-tree-order">ツリー順</a>にソートされた後に配置されます。</li>

+</ul>

+

+<h2 id="仕様">仕様</h2>

+

+<table class="standard-table">

+ <tbody>

+ <tr>

+ <th scope="col">仕様</th>

+ <th scope="col">ステータス</th>

+ <th scope="col">備考</th>

+ </tr>

+ <tr>

+ <td>{{SpecName('Shadow DOM','#extensions-to-the-documentorshadowroot-mixin','DocumentOrShadowRoot')}}</td>

+ <td>{{Spec2('Shadow DOM')}}</td>

+ <td>初回定義</td>

+ </tr>

+ </tbody>

+</table>

+

+<h2 id="ブラウザー実装状況">ブラウザー実装状況</h2>

+

+

+

+<p>{{Compat("api.DocumentOrShadowRoot.styleSheets")}}</p>