From ff9ea0cf9f0ea6217deefa7ad0dba35bf7f6c45e Mon Sep 17 00:00:00 2001 From: MDN Date: Thu, 8 Jul 2021 00:34:19 +0000 Subject: [CRON] sync translated content --- .../web/api/htmlorforeignelement/blur/index.html | 89 ++++++++++++ .../web/api/htmlorforeignelement/focus/index.html | 161 +++++++++++++++++++++ .../web/api/htmlorforeignelement/index.html | 59 ++++++++ 3 files changed, 309 insertions(+) create mode 100644 files/ja/orphaned/web/api/htmlorforeignelement/blur/index.html create mode 100644 files/ja/orphaned/web/api/htmlorforeignelement/focus/index.html create mode 100644 files/ja/orphaned/web/api/htmlorforeignelement/index.html (limited to 'files/ja/orphaned/web') diff --git a/files/ja/orphaned/web/api/htmlorforeignelement/blur/index.html b/files/ja/orphaned/web/api/htmlorforeignelement/blur/index.html new file mode 100644 index 0000000000..4d27786f8d --- /dev/null +++ b/files/ja/orphaned/web/api/htmlorforeignelement/blur/index.html @@ -0,0 +1,89 @@ +--- +title: HTMLElement.blur() +slug: orphaned/Web/API/HTMLOrForeignElement/blur +tags: + - API + - HTML DOM + - HTMLElement + - Method + - Reference +translation_of: Web/API/HTMLOrForeignElement/blur +original_slug: Web/API/HTMLOrForeignElement/blur +--- +
{{ APIRef("HTML DOM") }}
+ +

HTMLElement.blur() メソッドは、現在の要素からキーボードフォーカスを取り除きます。

+ +

構文

+ +
element.blur();
+ +

例

+ +

テキスト入力からフォーカスを取り除く

+ +

HTML

+ +
<input type="text" id="myText" value="サンプルテキスト">
+<br><br>
+<button type="button" onclick="focusInput()">クリックするとフォーカスを得ます</button>
+<button type="button" onclick="blurInput()">クリックするとフォーカスを失います</button>
+ +

JavaScript

+ +
function focusInput() {
+  document.getElementById('myText').focus();
+}
+function blurInput() {
+  document.getElementById('myText').blur();
+}
+ +

結果

+ +

{{ EmbedLiveSample('Remove_focus_from_a_text_input') }}

+ +

仕様

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('HTML WHATWG', 'editing.html#dom-blur', 'blur')}}{{Spec2('HTML WHATWG')}}
{{SpecName('HTML5.1', 'editing.html#blur()-0', 'blur')}}{{Spec2('HTML5.1')}}
{{SpecName('HTML5 W3C', 'editing.html#dom-blur', 'blur')}}{{Spec2('HTML5 W3C')}}
{{SpecName('DOM2 HTML', 'html.html#ID-28216144', 'blur')}}{{Spec2('DOM2 HTML')}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.HTMLElement.blur")}}

+ +

関連情報

+ + diff --git a/files/ja/orphaned/web/api/htmlorforeignelement/focus/index.html b/files/ja/orphaned/web/api/htmlorforeignelement/focus/index.html new file mode 100644 index 0000000000..b611f9aa1c --- /dev/null +++ b/files/ja/orphaned/web/api/htmlorforeignelement/focus/index.html @@ -0,0 +1,161 @@ +--- +title: HTMLElement.focus() +slug: orphaned/Web/API/HTMLOrForeignElement/focus +tags: + - API + - Focus + - HTML DOM + - HTMLElement + - Method + - Reference + - Scroll + - View + - activate +translation_of: Web/API/HTMLOrForeignElement/focus +original_slug: Web/API/HTMLOrForeignElement/focus +--- +
{{ APIRef("HTML DOM") }}
+ +

HTMLElement.focus() メソッドは、指定された要素にフォーカスを設定できる場合、フォーカスを設定します。 フォーカスされた要素は、デフォルトでキーボードや同様のイベントを受け取る要素です。

+ +

構文

+ +
element.focus(options); // Object parameter
+ +

パラメーター

+ +
+
options {{optional_inline}}
+
フォーカスプロセスの側面を制御するオプションを提供するオプションのオブジェクト。 このオブジェクトには、次のプロパティが含まれる場合があります。
+
+
+
preventScroll {{optional_inline}}
+
ブラウザーがドキュメントをスクロールして、新しくフォーカスされた要素を表示するかどうかを示す Boolean の値。 preventScroll の値が false（デフォルト）の場合、ブラウザーは要素をフォーカスした後、その要素をスクロールして表示します。 preventScroll が true に設定されている場合、スクロールしません。
+
+
+
+ +

例

+ +

テキストフィールドにフォーカスする

+ +

JavaScript

+ +
focusMethod = function getFocus() {
+  document.getElementById("myTextField").focus();
+}
+ +

HTML

+ +
<input type="text" id="myTextField" value="テキストフィールド">
+<p></p>
+<button type="button" onclick="focusMethod()">クリックしてテキストフィールドにフォーカスしてください！</button>
+
+ +

結果

+ +

{{ EmbedLiveSample('Focus_on_a_text_field') }}

+ +

ボタンにフォーカスする

+ +

JavaScript

+ +
focusMethod = function getFocus() {
+  document.getElementById("myButton").focus();
+}
+
+ +

HTML

+ +
<button type="button" id="myButton">クリックしてください！</button>
+<p></p>
+<button type="button" onclick="focusMethod()">クリックしてボタンにフォーカスしてください！</button>
+
+ +

結果

+ +

{{ EmbedLiveSample('Focus_on_a_button') }}

+ +

focusOption でフォーカスする

+ +

JavaScript

+ +
focusScrollMethod = function getFocus() {
+  document.getElementById("myButton").focus({preventScroll:false});
+}
+focusNoScrollMethod = function getFocusWithoutScrolling() {
+  document.getElementById("myButton").focus({preventScroll:true});
+}
+
+
+ +

HTML

+ +
<button type="button" onclick="focusScrollMethod()">クリックしてボタンにフォーカスしてください！</button>
+<button type="button" onclick="focusNoScrollMethod()">クリックしてスクロールせずにボタンにフォーカスしてください！</button>
+
+<div id="container" style="height: 1000px; width: 1000px;">
+<button type="button" id="myButton" style="margin-top: 500px;">クリックしてください！</button>
+</div>
+
+
+ +

結果

+ +

{{ EmbedLiveSample('Focus_prevent_scroll') }}

+ +

仕様

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('HTML WHATWG', 'editing.html#dom-focus', 'focus')}}{{Spec2('HTML WHATWG')}}
{{SpecName('HTML5.1', 'editing.html#focus()-0', 'focus')}}{{Spec2('HTML5.1')}}
{{SpecName('HTML5 W3C', 'editing.html#dom-focus', 'focus')}}{{Spec2('HTML5 W3C')}}
{{SpecName('DOM2 HTML', 'html.html#ID-32130014', 'focus')}}{{Spec2('DOM2 HTML')}}
{{SpecName('DOM1', 'level-one-html.html#method-focus', 'focus')}}{{Spec2('DOM1')}}
+ +

ノート

+ +

mousedown イベントハンドラから HTMLElement.focus() を呼び出す場合は、event.preventDefault() を呼び出して、フォーカスがその HTMLElement から離れないようにする必要があります。

+ +

ブラウザーの互換性

+ + + +

{{Compat("api.HTMLElement.focus")}}

+ +

関連情報

+ + diff --git a/files/ja/orphaned/web/api/htmlorforeignelement/index.html b/files/ja/orphaned/web/api/htmlorforeignelement/index.html new file mode 100644 index 0000000000..8fc2702a71 --- /dev/null +++ b/files/ja/orphaned/web/api/htmlorforeignelement/index.html @@ -0,0 +1,59 @@ +--- +title: HTMLOrForeignElement +slug: orphaned/Web/API/HTMLOrForeignElement +tags: + - API + - HTML + - HTMLElement + - HTMLOrForeignElement + - Interface + - MathML + - MathMLElement + - Mixin + - Reference + - SVG + - SVGElement + - ミックスイン +translation_of: Web/API/HTMLOrForeignElement +original_slug: Web/API/HTMLOrForeignElement +--- +
{{APIRef("HTML DOM")}}{{Draft}}
+ +

HTMLOrForeignElement ミックスインは、 {{DOMxRef("HTMLElement")}}, {{DOMxRef("SVGElement")}}, {{DOMxRef("MathMLElement")}} の各インターフェイスで共通のいくつかの機能を説明します。これらのインターフェイスは、もちろん、以下の列挙したものに加えたものに加えてもっと機能があります。

+ +
+

メモ: HTMLOrForeignElement はミックスインであり、インターフェイスではありません。実際に HTMLOrForeignElement 型のオブジェクトを生成することはできません。

+
+ +
{{InterfaceOverview("HTML DOM")}}
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName("HTML WHATWG", "dom.html#htmlorsvgelement", 'HTMLOrForeignElement')}}{{Spec2('HTML WHATWG')}}初回定義
+ +

ブラウザーの互換性

+ +

{{Compat("api.HTMLOrForeignElement")}}

+ +

関連情報

+ + -- cgit v1.2.3-54-g00ecf