HTML 文書が designMode に切り替えられた時、 document オブジェクトは、フォーム入力欄contenteditable を持った要素のように現在編集可能な領域を操作するためにコマンドを実行するために、 execCommand メソッドを公開します。

多くのコマンドは、文書の選択範囲に対して影響を及ぼしますが (bold, italics, など)、他にも新しい要素の挿入 (リンクの追加) や行全体に影響するもの (字下げ) もあります。 contentEditable を使用した場合、 execCommand() は現在アクティブな編集可能要素に影響を及ぼします。

構文

bool = document.execCommand(aCommandName, aShowDefaultUI, aValueArgument)

返値

Boolean で、コマンドが対応していないか無効であれば false になります。

メモ: ユーザーとの対話の一部である場合にのみ true を返します。コマンドを呼び出す前にブラウザーが対応しているかどうかを検査するために、返値を使用しないでください。

引数

aCommandName
DOMString で、実行するコマンドの名前を指定します。使用可能なコマンドの一覧は、コマンドの節をご覧ください。
aShowDefaultUI
Boolean で、既定のユーザインターフェースを表示するかどうかを指示します。 Mozilla では未実装です。
aValueArgument
追加の引数を必要とするコマンドの引数 (例えば、 insertImage では挿入する画像の URL)。引数の値は DOMString です。引数が不要な場合は null を指定します。

コマンド

backColor
文書の背景色を変更します。 styleWithCss モードでは、文書ではなく含まれているブロックの背景色に影響します。引数として <color> 値の文字列を渡す必要があります。ただし、Internet Explorer ではテキストの背景色を設定するために使用します。
bold
選択範囲または挿入位置の太字のオンとオフを切り替えます。 Internet Explorer は <b> タグの代わりに <strong> タグを使用します。
ClearAuthenticationCache
キャッシュからすべての認証情報をクリアします。
contentReadOnly
コンテンツドキュメントを読み取り専用または編集可能にします。引数として true または false の真偽値が必要です。 (Internet Explorer は対応していません。)
copy
現在の選択範囲をクリップボードにコピーします。この動作が有効になる条件は、ブラウザーによって様々であり、時の経過により発展する可能性があります。このコマンドが使用可能かどうかは、ブラウザーの対応のセクションで確認してください。
createLink
選択範囲からハイパーリンクを作成しますが、選択範囲があるときだけです。ハイパーリンクの href の引数として、 URI が必要です。 URI は少なくとも1文字を含む必要があり、空白文字でもかまいません。 (Internet Explorer は null 値でリンクを作成できます。)
cut
現在の選択範囲を除去して、クリップボードにコピーします。いつこの動作が有効になるかはブラウザーによって様々であり、条件は時期によって変化しています。使用方法の詳細はブラウザーの対応で確認してください。
decreaseFontSize
選択範囲の前後または挿入位置に <small> タグを追加します。(Internet Explorer では対応していません。)
defaultParagraphSeparator
編集可能なテキスト領域に新しい段落が作成された時の、段落区切りを変更します。詳しくはマークアップ生成の違いを参照してください。
delete
現在の選択範囲を削除します。
enableAbsolutePositionEditor
絶対配置の要素を移動させるためのグラバーを有効化または無効化します。 Firefox 63 ベータ版/開発者エディションでは、既定で無効です。 (バグ 1449564)
enableInlineTableEditing
票のの行/列の挿入・削除コントロールを有効または無効にします。 Firefox 63 ベータ版/開発者エディションでは、既定で無効です。 (バグ 1449564)
enableObjectResizing
画像、表、絶対配置の要素、などの大きさの変更が可能なオブジェクトにおいて、大きさ変更用のハンドルを有効化または無効化します。 Firefox 63 ベータ版/開発者エディションでは、既定で無効です。 (バグ 1449564)
fontName
選択範囲または挿入位置のフォント名を変更します。引数としてフォント名の文字列 ("Arial" など) が必要です。
fontSize
選択範囲または挿入位置のフォントサイズを変更します。引数として 1-7 の整数値が必要です。
foreColor
選択範囲または挿入位置のフォント色を変更します。引数として16進表記で色の値の文字列が必要です。
formatBlock
現在の選択範囲を含む行の前後に HTML ブロックレベル要素を追加し、すでに存在する場合は、その行を含むブロック要素に置き換えます (Firefox では <blockquote> は例外です。 — これはブロック要素を囲みます)。引数としてタグ名の文字列が必要です。実質的にすべてのブロックレベル要素を利用することができます。 (Internet Explorer は見出しタグ H1H6, ADDRESS, PRE のみに対応しており、 "<H1>" のように山かっこで囲む必要があります。)
forwardDelete
カーソル位置より前の文字を 1 文字削除します。これは、 Windows のキーボードで Delete キーを押すのと同じ動作です。
heading
選択範囲または挿入位置の行の周りに見出し要素を追加します。引数としてタグ名の文字列 (つまり "H1""H6") が必要です。 (Internet Explorer や Safari は対応していません。)
hiliteColor
選択範囲または挿入位置の背景色を変更します。引数として color 値の文字列が必要です。この機能は useCSStrue にしないと使えません。(Internet Explorer では対応していません。)
increaseFontSize
選択範囲または挿入位置に <big> タグを追加します。(Internet Explorer では対応していません。)
indent
選択範囲または挿入位置を含む行を字下げします。Firefox では、選択範囲が字下げレベルの異なる複数行にわたる場合、選択範囲内の最も字下げの少ない行のみが字下げされます。
insertBrOnReturn
Enter キーで <br> 要素を挿入するか現在のブロック要素を二分割するかを制御します。 (Internet Explorer では対応していません。)
insertHorizontalRule
挿入位置に <hr> 要素を挿入するか、選択範囲を置き換えるかします。
insertHTML
挿入位置に HTML 文字列を挿入します (選択範囲は削除されます)。引数として正しい HTML 文字列が必要です。(Internet Explorer では対応していません。)
insertImage
挿入位置に画像を挿入します (選択範囲は削除されます)。引数として画像の src のための URL 文字列が必要です。この文字列の要求事項は、 createLink と同じです。
insertOrderedList
選択範囲または挿入位置に番号付き順序付きリストを生成します。
insertUnorderedList
選択範囲または挿入位置行頭記号付き順序なしリストを生成します。
insertParagraph
選択範囲の前後または現在の行に段落を挿入します。(Internet Explorer は挿入位置に段落を挿入し、現在の選択範囲を削除します。)
insertText
挿入位置に与えられたプレーンテキストを挿入します (選択範囲は削除されます)。
italic
選択範囲または挿入位置のイタリック体のオンとオフを切り替えます。(Internet Explorer は <i> 要素ではなく、 <em> 要素を使用します。)
justifyCenter
選択範囲または挿入位置を中央揃えにします。
justifyFull
選択範囲または挿入位置を両端揃えにします。
justifyLeft
選択範囲または挿入位置を左寄せにします。
justifyRight
選択範囲または挿入位置を右寄せにします。
outdent
選択範囲または挿入位置を含む行の字下げを戻します。
paste
クリップボードのコンテンツを挿入位置に貼り付け (ペースト) します (現在の選択範囲は置き換えられます)。ウェブコンテンツでは無効です。 [1] を参照。
redo
前回の undo コマンドを元に戻します。
removeFormat
現在の選択範囲からすべての書式を削除します。
selectAll
編集可能領域のすべてのコンテンツを選択します。
strikeThrough
選択範囲または挿入位置の取り消し線のオンとオフを切り替えます。
subscript
選択範囲または挿入位置の下付き文字のオンとオフを切り替えます。
superscript
選択範囲または挿入位置の上付き文字のオンとオフを切り替えます。
underline
選択範囲または挿入位置の下線のオンとオフを切り替えます。
undo
最後に実行したコマンドを取り消します。
unlink
選択されたハイパーリンクからアンカー要素を削除します。
useCSS
生成するマークアップに HTML タグと CSS のどちらを使用するかを切り替えます。引数として true または false の真偽値が必要です。
メモ: この引数は論理的に逆で (つまり、 false で CSS が使用され、true で HTML が使用される)、 Internet Explorer では対応していません。これは styleWithCSS に置き換えられ、非推奨になりました。
styleWithCSS
useCSS コマンドを置き換えるものです。 true はマークアップ時に style 属性が生成または変更され、 false では書式要素が生成されます。

CodePen に使用方法の例があります。

仕様書

仕様書 状態 備考
HTML Editing APIs
execCommand の定義
編集者草案 初回定義

ブラウザーの対応

機能ChromeEdgeFirefoxInternet ExplorerOperaSafari
基本対応 あり あり あり あり あり あり
insertBrOnReturn command なし なし あり なし なし なし
copy command あり あり4192910
cut command あり あり4192910
defaultParagraphSeparator command あり あり55 なし あり なし
ClearAuthenticationCache command なし あり なし6 なし なし
機能Android webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
基本対応 あり あり あり あり あり あり ?
insertBrOnReturn command なし なし なし あり なし なし ?
copy command あり あり あり412910 ?
cut command あり あり あり412910 ?
defaultParagraphSeparator command あり あり あり55 あり なし ?
ClearAuthenticationCache command なし なし あり なし なし なし ?

関連情報

ドキュメントのタグと貢献者

このページの貢献者: mfuji09, sisidovski, knchst0704, Marsf, fscholz, ethertank
最終更新者: mfuji09,