Document.execCommand() - 編集コマンドを実行する
execCommand()は、Documentのメソッドです。編集コマンドを実行します。
概要
- 名前
- execCommand
- 所属
- Document
- IDL
[CEReactions] boolean execCommand(DOMString commandId, optional boolean showUI = false, optional DOMString value = "");
- 仕様書
- https://w3c.github.io/editing/execCommand.html#execcommand%28%29
説明
第1引数(commandId)には、編集コマンドを表す文字列を指定します。
第2引数(showUI)には、デフォルトのUIを表示するか否かを指定します。
第3引数(value)には、編集コマンドの種類によっては必要な、追加の引数を指定します。
コマンドを実行できた場合はtrue、できなかった場合はfalseを返します。
デモ
Document.execCommand()のデモです。メソッドを実行すると、テキストの選択範囲をコピーします。
<!-- このコードは編集できます。 -->
<!DOCTYPE html>
<head>
<style>
input, textarea { width: 50% ; font-size: 16px ; }
</style>
</head>
<body>
<p><button id="run" type="button">実行</button></p>
<p>SYNCER SYNCER SYNCER SYNCER</p>
<hr>
返り値 → <span id="result"></span>
<hr>
<p>コピーできたか、ペーストしてみて下さい。</p>
<p><textarea></textarea></p>
<script>
document.getElementById( "run" ).onclick = function () {
var response = document.execCommand( "copy" ) ;
console.log( response ) ;
document.getElementById( "result" ).textContent = response ;
}
</script>
</body>
</html>
サポート状況
Chrome | Firefox | Safari | Edge | IE | Opera | iOS Safari | Android |
---|---|---|---|---|---|---|---|
● | ● | ● | ● | ● | ● | ● | ● |
関連記事
- Document
- Documentは、ドキュメントを管理するための機能を備えたインターフェイスです。
- IDLリファレンス
- WHATWGやW3Cで定義されているDOMなどのWeb APIの仕様を、サンプルコードやデモ付きでまとめています。
- 指定文字を置換、削除する
- 文字列の中の指定した部分を置換したり削除します。
- Document.getElementsByClassName()
- getElementsByClassName()は、Documentのメソッドです。class属性を指定して要素を取得します。