diff --git a/files/ja/web/api/gpucompilationmessage/index.md b/files/ja/web/api/gpucompilationmessage/index.md new file mode 100644 index 00000000000000..600612aa0caebe --- /dev/null +++ b/files/ja/web/api/gpucompilationmessage/index.md @@ -0,0 +1,45 @@ +--- +title: GPUCompilationMessage +slug: Web/API/GPUCompilationMessage +l10n: + sourceCommit: 89c435da452257b944b403cc9e45036fcb22590e +--- + +{{APIRef("WebGPU API")}}{{SeeCompatTable}}{{SecureContext_Header}} + +{{domxref("WebGPU API", "WebGPU API", "", "nocode")}} の **`GPUCompilationMessage`** インターフェイスは、GPU シェーダーモジュールコンパイラーが生成した 1 個の情報・警告・エラーのメッセージを表します。 + +`GPUCompilationMessage` オブジェクトの配列を、{{domxref("GPUShaderModule.getCompilationInfo()")}} からアクセスできる {{domxref("GPUCompilationInfo")}} オブジェクトの `messages` プロパティで参照できます。 + +{{InheritanceDiagram}} + +## インスタンスプロパティ + +- {{domxref("GPUCompilationMessage.length", "length")}} {{Experimental_Inline}} {{ReadOnlyInline}} + - : メッセージが対応する部分文字列の長さを表す数値です。 +- {{domxref("GPUCompilationMessage.lineNum", "lineNum")}} {{Experimental_Inline}} {{ReadOnlyInline}} + - : メッセージが対応するシェーダーコードの行番号を表す数値です。 +- {{domxref("GPUCompilationMessage.linePos", "linePos")}} {{Experimental_Inline}} {{ReadOnlyInline}} + - : メッセージが対応するコードの行内の位置を表す数値です。これは点であることも、関係する部分文字列の始点であることもあります。 +- {{domxref("GPUCompilationMessage.message", "message")}} {{Experimental_Inline}} {{ReadOnlyInline}} + - : 人間向けのメッセージテキストを表す文字列です。 +- {{domxref("GPUCompilationMessage.offset", "offset")}} {{Experimental_Inline}} {{ReadOnlyInline}} + - : シェーダーコードの始点から、メッセージが対応する点または関連する部分文字列の始点までのオフセットを表す数値です。 +- {{domxref("GPUCompilationMessage.type", "type")}} {{Experimental_Inline}} {{ReadOnlyInline}} + - : メッセージの種類を表す列挙値です。`"error"`・`"info"`・`"warning"` のいずれかです。 + +## 例 + +例はメインの [`GPUCompilationInfo` のページ](/ja/docs/Web/API/GPUCompilationInfo#例)を参照してください。 + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- [WebGPU API](/ja/docs/Web/API/WebGPU_API) diff --git a/files/ja/web/api/gpucompilationmessage/length/index.md b/files/ja/web/api/gpucompilationmessage/length/index.md new file mode 100644 index 00000000000000..b077e8519e5aa0 --- /dev/null +++ b/files/ja/web/api/gpucompilationmessage/length/index.md @@ -0,0 +1,45 @@ +--- +title: "GPUCompilationMessage: length プロパティ" +slug: Web/API/GPUCompilationMessage/length +l10n: + sourceCommit: 89c435da452257b944b403cc9e45036fcb22590e +--- + +{{APIRef("WebGPU API")}}{{SeeCompatTable}}{{SecureContext_Header}} + +{{domxref("GPUCompilationMessage")}} インターフェイスの読み取り専用プロパティ **`length`** は、メッセージが対応する部分文字列の長さを表す数値です。 + +## 値 + +数値です。 + +正確には、`length` はメッセージが対応するシェーダーコードの部分文字列に含まれる UTF-16 コードユニットの数です。メッセージが部分文字列ではなく単一の点に対応する場合は、`length` は 0 になります。 + +## 例 + +```js + // ... + const shaderModule = device.createShaderModule({ + code: shaders, + }); + + const shaderInfo = await shaderModule.getCompilationInfo(); + const firstMessage = shaderInfo.messages[0]; + console.log(firstMessage.length); + // ... +} +``` + +より詳細な例は、メインの [`GPUCompilationInfo` のページ](/ja/docs/Web/API/GPUCompilationInfo#例)を参照してください。 + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- [WebGPU API](/ja/docs/Web/API/WebGPU_API) diff --git a/files/ja/web/api/gpucompilationmessage/linenum/index.md b/files/ja/web/api/gpucompilationmessage/linenum/index.md new file mode 100644 index 00000000000000..8bde33a4b56569 --- /dev/null +++ b/files/ja/web/api/gpucompilationmessage/linenum/index.md @@ -0,0 +1,50 @@ +--- +title: "GPUCompilationMessage: lineNum プロパティ" +slug: Web/API/GPUCompilationMessage/lineNum +l10n: + sourceCommit: 89c435da452257b944b403cc9e45036fcb22590e +--- + +{{APIRef("WebGPU API")}}{{SeeCompatTable}}{{SecureContext_Header}} + +{{domxref("GPUCompilationMessage")}} インターフェイスの読み取り専用プロパティ **`lineNum`** は、メッセージが対応するシェーダーコードの行番号を表す数値です。 + +## 値 + +数値です。 + +以下の点に注意してください。 + +- メッセージが部分文字列に対応する場合は、`lineNum` は部分文字列の始点の行番号を表します。 +- メッセージがコードの特定の行に対応していない場合 (シェーダーコード全体についてかもしれません) は、`lineNum` は 0 になります。 +- 値は one-based です。すなわち、値 1 がコードの最初の行を表します。 +- 行は改行で分割されます。WGSL では、[特定の文字のリスト](https://gpuweb.github.io/gpuweb/wgsl/#line-break)が改行として定義されています。 + +## 例 + +```js + // ... + const shaderModule = device.createShaderModule({ + code: shaders, + }); + + const shaderInfo = await shaderModule.getCompilationInfo(); + const firstMessage = shaderInfo.messages[0]; + console.log(firstMessage.lineNum); + // ... +} +``` + +より詳細な例は、メインの [`GPUCompilationInfo` のページ](/ja/docs/Web/API/GPUCompilationInfo#例)を参照してください。 + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- [WebGPU API](/ja/docs/Web/API/WebGPU_API) diff --git a/files/ja/web/api/gpucompilationmessage/linepos/index.md b/files/ja/web/api/gpucompilationmessage/linepos/index.md new file mode 100644 index 00000000000000..64f72f25467da3 --- /dev/null +++ b/files/ja/web/api/gpucompilationmessage/linepos/index.md @@ -0,0 +1,51 @@ +--- +title: "GPUCompilationMessage: linePos プロパティ" +slug: Web/API/GPUCompilationMessage/linePos +l10n: + sourceCommit: 89c435da452257b944b403cc9e45036fcb22590e +--- + +{{APIRef("WebGPU API")}}{{SeeCompatTable}}{{SecureContext_Header}} + +{{domxref("GPUCompilationMessage")}} インターフェイスの読み取り専用プロパティ **`linePos`** は、メッセージが対応するコードの行内の位置を表す数値です。これは点であることも、関係する部分文字列の始点であることもあります。 + +## 値 + +数値です。 + +正確には、`linePos` は行の始点から、メッセージが対応する点または関係する部分文字列の始点までの UTF-16 コードユニットの数です。 + +以下の点に注意してください。 + +- メッセージが部分文字列に対応している場合は、`linePos` はその部分文字列の最初の UTF-16 コードユニットを指します。 +- メッセージがコード内の特定の位置に対応しない場合 (シェーダーコード全体についてかもしれません) は、`linePos` は 0 になります。 +- 値は one-based です。すなわち、値 1 が行内の最初のコードユニットを表します。 + +## 例 + +```js + // ... + const shaderModule = device.createShaderModule({ + code: shaders, + }); + + const shaderInfo = await shaderModule.getCompilationInfo(); + const firstMessage = shaderInfo.messages[0]; + console.log(firstMessage.linePos); + // ... +} +``` + +より詳細な例は、メインの [`GPUCompilationInfo` のページ](/ja/docs/Web/API/GPUCompilationInfo#例)を参照してください。 + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- [WebGPU API](/ja/docs/Web/API/WebGPU_API) diff --git a/files/ja/web/api/gpucompilationmessage/message/index.md b/files/ja/web/api/gpucompilationmessage/message/index.md new file mode 100644 index 00000000000000..26ef9b8d9f1156 --- /dev/null +++ b/files/ja/web/api/gpucompilationmessage/message/index.md @@ -0,0 +1,43 @@ +--- +title: "GPUCompilationMessage: message プロパティ" +slug: Web/API/GPUCompilationMessage/message +l10n: + sourceCommit: 89c435da452257b944b403cc9e45036fcb22590e +--- + +{{APIRef("WebGPU API")}}{{SeeCompatTable}}{{SecureContext_Header}} + +{{domxref("GPUCompilationMessage")}} インターフェイスの読み取り専用プロパティ **`message`** は、人間向けのメッセージテキストを表す文字列です。 + +## 値 + +文字列です。 + +## 例 + +```js + // ... + const shaderModule = device.createShaderModule({ + code: shaders, + }); + + const shaderInfo = await shaderModule.getCompilationInfo(); + const firstMessage = shaderInfo.messages[0]; + console.log(firstMessage.message); + // ... +} +``` + +より詳細な例は、メインの [`GPUCompilationInfo` のページ](/ja/docs/Web/API/GPUCompilationInfo#例)を参照してください。 + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- [WebGPU API](/ja/docs/Web/API/WebGPU_API) diff --git a/files/ja/web/api/gpucompilationmessage/offset/index.md b/files/ja/web/api/gpucompilationmessage/offset/index.md new file mode 100644 index 00000000000000..06b2b297a67443 --- /dev/null +++ b/files/ja/web/api/gpucompilationmessage/offset/index.md @@ -0,0 +1,47 @@ +--- +title: "GPUCompilationMessage: offset プロパティ" +slug: Web/API/GPUCompilationMessage/offset +l10n: + sourceCommit: 89c435da452257b944b403cc9e45036fcb22590e +--- + +{{APIRef("WebGPU API")}}{{SeeCompatTable}}{{SecureContext_Header}} + +{{domxref("GPUCompilationMessage")}} インターフェイスの読み取り専用プロパティ **`offset`** は、シェーダーコードの始点から、メッセージが対応する点または関連する部分文字列の始点までのオフセットを表す数値です。 + +## 値 + +数値です。 + +正確には、`offset` はシェーダーコードの始点から、メッセージが対応する点または関連する部分文字列の始点までの UTF-16 コードユニットの数です。 + +メッセージが特定のコード位置に対応しない場合 (シェーダーコード全体についてかもしれません) は、`offset` は 0 になります。 + +## 例 + +```js + // ... + const shaderModule = device.createShaderModule({ + code: shaders, + }); + + const shaderInfo = await shaderModule.getCompilationInfo(); + const firstMessage = shaderInfo.messages[0]; + console.log(firstMessage.offset); + // ... +} +``` + +より詳細な例は、メインの [`GPUCompilationInfo` のページ](/ja/docs/Web/API/GPUCompilationInfo#例)を参照してください。 + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- [WebGPU API](/ja/docs/Web/API/WebGPU_API) diff --git a/files/ja/web/api/gpucompilationmessage/type/index.md b/files/ja/web/api/gpucompilationmessage/type/index.md new file mode 100644 index 00000000000000..f553134a334ac6 --- /dev/null +++ b/files/ja/web/api/gpucompilationmessage/type/index.md @@ -0,0 +1,50 @@ +--- +title: "GPUCompilationMessage: type プロパティ" +slug: Web/API/GPUCompilationMessage/type +l10n: + sourceCommit: 89c435da452257b944b403cc9e45036fcb22590e +--- + +{{APIRef("WebGPU API")}}{{SeeCompatTable}}{{SecureContext_Header}} + +{{domxref("GPUCompilationMessage")}} インターフェイスの読み取り専用プロパティ **`type`** は、メッセージの種類を表す列挙値です。それぞれの種類が異なる深刻度を表します。 + +## 値 + +列挙値です。以下の値をとりえます。 + +- `"error"` + - : コンパイルが成功できなくなる、シェーダー生成エラーです。 +- `"info"` + - : 参考になるだけのメッセージで、深刻度は低いです。 +- `"warning"` + - : コンパイルが成功しないわけではないが、開発者の注意を引くことが有益な問題についての警告です。たとえば、非推奨の関数や文法の使用についてです。 + +## 例 + +```js + // ... + const shaderModule = device.createShaderModule({ + code: shaders, + }); + + const shaderInfo = await shaderModule.getCompilationInfo(); + const firstMessage = shaderInfo.messages[0]; + console.log(firstMessage.type); + // ... +} +``` + +より詳細な例は、メインの [`GPUCompilationInfo` のページ](/ja/docs/Web/API/GPUCompilationInfo#例)を参照してください。 + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- [WebGPU API](/ja/docs/Web/API/WebGPU_API) diff --git a/files/ja/web/api/htmlelement/autocapitalize/index.md b/files/ja/web/api/htmlelement/autocapitalize/index.md new file mode 100644 index 00000000000000..7101c504d69c1e --- /dev/null +++ b/files/ja/web/api/htmlelement/autocapitalize/index.md @@ -0,0 +1,75 @@ +--- +title: "HTMLElement: autocapitalize プロパティ" +short-title: autocapitalize +slug: Web/API/HTMLElement/autocapitalize +l10n: + sourceCommit: f58b59a00199bb177beefa245f104ecbd86dae5c +--- + +{{APIRef("HTML DOM")}} + +**`autocapitalize`** は {{domxref("HTMLElement")}} インターフェイスのプロパティで、ユーザー入力に対する要素の大文字化動作を表します。すべての HTML 要素で利用可能ですが、すべての要素に影響するわけでははなく、次の要素でに影響します。 + +- {{htmlelement("input")}} および {{htmlelement("textarea")}} 要素。 +- [`contenteditable`](/ja/docs/Web/HTML/Global_attributes/contenteditable) が設定された任意の要素。 + +`autocapitalize` は物理的なキーボードで入力するときの動作には影響しません。モバイル端末の仮想キーボードや音声入力など、他の入力メカニズムの動作に影響します。例えば、各文の最初の文字を自動的に大文字にすることで、データ入力を素早く簡単にすることができます。 + +これは、HTML の [`autocapitalize`](/ja/docs/Web/HTML/Global_attributes/autocapitalize) グローバル属性の値を反映します。 + +## 値 + +文字列で、この要素のユーザー入力に対する大文字小文字の動作を表します。有効な値は以下の通りです: + +- `none` または `off` + - : 自動大文字化を適用せず、すべての文字を既定で小文字にします。 +- `sentences` または `on` + - : 各文の先頭の文字は既定で大文字にし、それ以外の文字は小文字にします。 +- `words` + - : 各単語の最初の文字を既定で大文字にし、それ以外の文字を小文字にします。 +- `characters` + - : すべての文字は既定で大文字になります。 + +## 例 + +次の例は、スクリプトを使ってユーザー入力の大文字小文字を制御する方法を示します。 + +```html +
現在の大文字化の動作は です。
+
+ input here +
+大文字化の動作を選択してください。 +``` + +```js +const label = document.getElementById("ac-label"); +const element = document.getElementById("ac-element"); +const controller = document.getElementById("ac-controller"); + +controller.addEventListener("input", (e) => { + const behavior = e.target.value; + label.textContent = behavior; + element.autocapitalize = behavior; +}); +``` + +{{EmbedLiveSample('Examples', 600, 200)}} + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- HTML の [`autocapitalize`](/ja/docs/Web/HTML/Global_attributes#autocapitalize) グローバル属性 diff --git a/files/ja/web/api/htmlelement/autofocus/index.md b/files/ja/web/api/htmlelement/autofocus/index.md index faf5df2fbabd7d..0e049077000232 100644 --- a/files/ja/web/api/htmlelement/autofocus/index.md +++ b/files/ja/web/api/htmlelement/autofocus/index.md @@ -3,7 +3,7 @@ title: "HTMLElement: autofocus プロパティ" short-title: autofocus slug: Web/API/HTMLElement/autofocus l10n: - sourceCommit: 2c22a294a6394a439cb9496a70c46fee69f31ff7 + sourceCommit: e9e2ec643ac69c132f31427a0b586ab2cf83ed58 --- {{APIRef("HTML DOM")}} @@ -13,7 +13,7 @@ l10n: この属性を指定することができるのは、1 つの文書内、または {{htmlelement("dialog")}} 要素内、または `popover` 属性が設定された要素内のフォーム関連要素 1 つだけです。もし複数あった場合、属性が設定された最初の要素(通常は該当する要素のうちページで最初のもの)が初期のフォーカスを得ます。 > [!NOTE] -> このプロパティを設定しても、関連付けられた {{HTMLElement("select")}} 要素へフォーカスは設定されません。単純に文書へ*要素が挿入された*ときにブラウザーへフォーカスを移動するよう指示するだけです。挿入後に設定した場合、すなわち文書が読み込まれた後のほとんどの場合では、目に見える効果はありません。 +> このプロパティを設定しても、関連付けられた要素へフォーカスは設定されません。単純に文書へ*要素が挿入された*ときにブラウザーへフォーカスを移動するよう指示するだけです。挿入後に設定した場合、すなわち文書が読み込まれた後のほとんどの場合では、目に見える効果はありません。 ## 値 diff --git a/files/ja/web/api/htmlelement/contenteditable/index.md b/files/ja/web/api/htmlelement/contenteditable/index.md index 5b454400fe7fa5..29993f715462ca 100644 --- a/files/ja/web/api/htmlelement/contenteditable/index.md +++ b/files/ja/web/api/htmlelement/contenteditable/index.md @@ -1,8 +1,9 @@ --- title: "HTMLElement: contentEditable プロパティ" +short-title: contentEditable slug: Web/API/HTMLElement/contentEditable l10n: - sourceCommit: a3d9f61a8990ba7b53bda9748d1f26a9e9810b18 + sourceCommit: 61f855f3f8155a2dc1ddb5671bdac032f11ecee7 --- {{APIRef("HTML DOM")}} @@ -13,10 +14,12 @@ l10n: - '`true`' は、要素の内容が編集可能 (`contenteditable`) であることを示します。 - '`false`' は、要素が編集できないことを示します。 -- '`inherit`' は、要素がその親の編集可能状態を継承することを示します。 +- '`plaintext-only`' は要素の生のテキストは編集可能ですが、リッチテキストの書式は編集できないことを示します。 {{domxref("HTMLElement.isContentEditable")}} プロパティを使用すると、このプロパティの計算済みの論理値をテストできます。 +属性がない、またはその値が不正な場合、その値は親要素から継承されます。したがって、要素は親要素に基づいて編集可能(または不可能)になります。 + ## 値 文字列。 diff --git a/files/ja/web/api/htmlelement/dataset/index.md b/files/ja/web/api/htmlelement/dataset/index.md index a70f1afd8b8682..2acc0c05c867a8 100644 --- a/files/ja/web/api/htmlelement/dataset/index.md +++ b/files/ja/web/api/htmlelement/dataset/index.md @@ -1,8 +1,9 @@ --- title: "HTMLElement: dataset プロパティ" +short-title: dataset slug: Web/API/HTMLElement/dataset l10n: - sourceCommit: a3d9f61a8990ba7b53bda9748d1f26a9e9810b18 + sourceCommit: e9e2ec643ac69c132f31427a0b586ab2cf83ed58 --- {{APIRef("HTML DOM")}} @@ -10,14 +11,14 @@ l10n: **`dataset`** は {{DOMxRef("HTMLElement")}} インターフェイスの読み取り専用プロパティで、要素に設定されたすべての[カスタムデータ属性](/ja/docs/Web/HTML/Global_attributes/data-*) (`data-*`) への読み取り/書き込みアクセスを提供します。これは文字列のマップである ({{domxref("DOMStringMap")}}) で、それぞれの `data-*` 属性の項目です。 > **メモ:** `dataset` プロパティ自体は読み取ることができますが、直接書き込むことはできません。 -> 代わりに、すべての書き込みは `dataset` 内の個々のプロパティに対して行う必要があり、それは data 属性を表します。 +> すべての書き込みは、個々の data 属性を表す `dataset` 内の個々のプロパティを表します。 -また、 HTML の `data-*` 属性とそれに対応する DOM `dataset.プロパティ` は同じ名前にはなりませんが、次のように常に近いものになります。 +また、 HTML の `data-*` 属性とそれに対応する DOM の `dataset.プロパティ` は同じ名前にはなりませんが、次のように常に近いものになります。 - HTML では - - : 属性の名前は、 `data-` で始まります。文字、数字、ダッシュ (`-`)、ドット (`.`)、コロン (`:`)、アンダースコア (`_`) のみを入れることができます。 ASCII 大文字の `A` から `Z` は小文字に変換されます。 + - : 属性の名前は、 `data-` で始まります。文字、数字、ダッシュ (`-`)、ドット (`.`)、コロン (`:`)、アンダースコア (`_`) のみを入れることができます。{{Glossary("ASCII")}} 大文字の `A` から `Z` は小文字に変換されます。 - JavaScript では - - : カスタムデータ属性のプロパティ名は、同じ HTML 属性の名前から `data-` の接頭辞を除いたものですが、そのプロパティのキャメルケース (camelCase) の名前であり、単一のダッシュ (`-`) を除いたものです。 + - : カスタムデータ属性のプロパティ名は、同じ HTML 属性の名前から `data-` の接頭辞を除いたものですが、そのプロパティの{{Glossary("camel_case", "キャメルケース")}}の名前であり、単一のダッシュ (`-`) を除いたものです。 以下の情報に加えて、[データ属性の使用](/ja/docs/Learn/HTML/Howto/Use_data_attributes)の記事に、HTML データ属性の使用方法に関するガイドがあります。 @@ -25,7 +26,7 @@ l10n: - ダッシュスタイルからキャメルケースへの変換 - - : カスタムデータ属性名は、次のルールに従って {{ domxref("DOMStringMap") }} 項目のキーに変換されます。 + - : カスタムデータ属性名は、次のルールに従って {{domxref("DOMStringMap") }} 項目のキーに変換されます。 1. すべての ASCII の大文字 (`A` から `Z` まで) を小文字にします。 2. 接頭辞の `data-` を(ダッシュを含め)削除します。 @@ -47,7 +48,8 @@ l10n: - 属性は dataset のオブジェクトプロパティのようにキャメルケース名(キー)を使用して、 `element.dataset.keyname` のように設定したり読み取ったりすることができます。 - 属性はブラケット構文を使用して、 `element.dataset['keyname']` のように設定したり読み取ったりすることもできます。 -- [`in` 演算子](/ja/docs/Web/JavaScript/Reference/Operators/in)を使用して、特定の属性が存在するかどうかを確認できます。 +- [`in` 演算子](/ja/docs/Web/JavaScript/Reference/Operators/in)を `'keyname' in element.dataset` のように使用すると、特定の属性が存在するかどうかを確認できます。 + これは `dataset` の[プロトタイプチェーン](/ja/docs/Web/JavaScript/Inheritance_and_the_prototype_chain)を走査することになり、プロトタイプチェーンを汚染する可能性のある外部コードを持っている場合には安全ではないことに注意してください。例えば {{jsxref("Object/hasOwn", "Object.hasOwn(element.dataset, 'keyname')")}} や、単に `element.dataset.keyname !== undefined` かどうかを調べる方法などがあります。 ### 値の設定 @@ -85,7 +87,7 @@ delete el.dataset.dateOfBirth; // JS での結果: el.dataset.dateOfBirth === undefined // HTML での結果:
Carina Anand
-if (!("someDataAttr" in el.dataset)) { +if (el.dataset.someDataAttr === undefined) { el.dataset.someDataAttr = "mydata"; // JS での結果: 'someDataAttr' in el.dataset === true // HTML での結果:
Carina Anand
diff --git a/files/ja/web/api/htmlelement/dir/index.md b/files/ja/web/api/htmlelement/dir/index.md index 70e2d7b08a565e..bfc1bec61cb728 100644 --- a/files/ja/web/api/htmlelement/dir/index.md +++ b/files/ja/web/api/htmlelement/dir/index.md @@ -1,8 +1,9 @@ --- title: "HTMLElement: dir プロパティ" +short-title: dir slug: Web/API/HTMLElement/dir l10n: - sourceCommit: a3d9f61a8990ba7b53bda9748d1f26a9e9810b18 + sourceCommit: e9e2ec643ac69c132f31427a0b586ab2cf83ed58 --- {{ApiRef("HTML DOM")}} diff --git a/files/ja/web/api/htmlelement/draggable/index.md b/files/ja/web/api/htmlelement/draggable/index.md new file mode 100644 index 00000000000000..6d56050026fbd8 --- /dev/null +++ b/files/ja/web/api/htmlelement/draggable/index.md @@ -0,0 +1,50 @@ +--- +title: "HTMLElement: draggable プロパティ" +short-title: draggable +slug: Web/API/HTMLElement/draggable +l10n: + sourceCommit: 71790d0ff0ecd94a2d734f81d98a3317b61aa468 +--- + +{{APIRef("HTML Drag and Drop API")}} + +**`draggable`** は {{domxref("HTMLElement")}} インターフェイスのプロパティで、要素がドラッグ可能かどうかを示す論理値プリミティブを取得または設定します。 + +これは、dragableHTML グローバル属性の値を反映します。 +It reflects the value of the [`draggable`](/ja/docs/Web/HTML/Global_attributes/draggable) HTML global attribute. + +## 値 + +論理値プリミティブで、要素がドラッグ可能であれば `true`、そうでなければ `false` です。 + +## 例 + +次の例は、スクリプトによる要素のドラッグ機能を有効または無効にする方法を示しています。 + +```js +const draggableElement = document.querySelector(".draggable-element"); +const notDraggableElement = document.querySelector(".not-draggable-element"); + +// 対象とする要素のドラッグ機能を有効にする +if (!draggableElement.draggable) { + draggableElement.draggable = true; +} + +// 対象とする要素のドラッグ機能を無効にする +if (notDraggableElement.draggable) { + notDraggableElement.draggable = false; +} +``` + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- HTML の [`draggable`](/ja/docs/Web/HTML/Global_attributes#draggable) グローバル属性 +- [HTML のドラッグ&ドロップ API](/ja/docs/Web/API/HTML_Drag_and_Drop_API) の概要 diff --git a/files/ja/web/api/htmlelement/editcontext/index.md b/files/ja/web/api/htmlelement/editcontext/index.md new file mode 100644 index 00000000000000..9e5c29533d712f --- /dev/null +++ b/files/ja/web/api/htmlelement/editcontext/index.md @@ -0,0 +1,95 @@ +--- +title: "HTMLElement: editContext プロパティ" +short-title: editContext +slug: Web/API/HTMLElement/editContext +l10n: + sourceCommit: c9fe79713a9323e8f1492c3c5b802fc8776a5f6a +--- + +{{APIRef("EditContext API")}}{{SeeCompatTable}} + +**`editContext`** は {{domxref("HTMLElement")}} インターフェイスのプロパティで、要素に関連付けられた {{domxref("EditContext")}} オブジェクトを取得したり設定したりします。 + +{{domxref("EditContext API", "", "", "nocode")}} を使用することで、{{glossary("Input Method Editor", "インプットメソッドエディター")}} (IME) の変換や絵文字ピッカー、その他のプラットフォーム固有の編集関連 UI サーフェスなど、高度なテキスト入力に対応したリッチテキストエディターをウェブ上で構築することができます。 + +### 利用可能な要素 + +`editContext` プロパティを設定して動作するのは、一部の種類の要素だけです。 + +- HTML 要素のうち、 [`
`](/ja/docs/Web/HTML/Element/article), [`