Document.queryCommandState() - 編集コマンドを実行したか確認する

2017/10/06

queryCommandState()は、Documentのメソッドです。編集コマンドを実行したか否かを確認します。

概要

名前

queryCommandState

所属

IDL

boolean queryCommandState(DOMString commandId);

仕様書

https://w3c.github.io/editing/execCommand.html#querycommandstate%28%29

説明

引数(commandId)には、対象の編集コマンドを表す文字列を指定します。

コマンドを既に実行している場合はtrue、違う場合はfalseを返します。

デモ

Document.queryCommandState()のデモです。テキストを選択して、編集コマンドの"bold"を実行してみて下さい。既に太字にしてある選択範囲に対して実行しようとすると、既に実行したことを表すtrueを返します。

<!-- このコードは編集できます。 -->

<!DOCTYPE html>
<head>
<style>
div#result { white-space: pre-wrap ; }
</style>
</head>
<body>
<p contenteditable="true">SYNCER SYNCER</p>
<p><button id="run">実行</button></p>
<hr>
<div id="result"></div>
<script>
document.getElementById( "run" ).onclick = function () {
	var response = document.queryCommandState( "bold" ) ;

	console.log( response ) ;
	document.getElementById( "result" ).textContent = response ;

	document.execCommand( "bold" ) ;
}
</script>
</body>
</html>