In order to access this site you need to enable JavaScript!

You are here: Reference > JavaScript > client-side > selection and ranges > methods > queryCommandState (document, TextRange, ...)

queryCommandState method (document, TextRange, ...)

Browser support:

Returns the current state of the specified command.

The effect of some commands depend on the current state of their target. For example, if the 'bold' command is executed by the execCommand method on a bold text, the bold formatting will be removed; otherwise it makes the text bold. So the queryCommandState method for the 'bold' command returns true on a bold text and returns false otherwise.

Syntax:

object.queryCommandState (commandIdentifier);

You can find the related objects in the Supported by objects section below.

Parameters:

commandIdentifier

Required. A case-insensitive string that specifies the name of the command. See command identifiers for more information.

Return value:

Boolean or null. One of the following values:

false	The specified command was previously not executed on the target.
true	The specified command was previously executed on the target.
null	The state of the specified command is indeterminable.

Example HTML code 1:

This example illustrates the use of the queryCommandState method:

<head>
    <script type="text/javascript">
        function SetToBold () {
            var state = document.queryCommandState ("bold");
            switch (state) {
            case true:
                alert ("The bold formatting will be removed from the selected text.");
                break;
            case false:
                alert ("The selected text will be displayed in bold.");
                break;
            case null:
                alert ("The state of the 'bold' command is indeterminable.");
                break;
            }

            document.execCommand ('bold', false, null);
        }
    </script>
</head>
<body>
    <div contenteditable="true">Select a part of this text!</div>
    <br /><br />
    <button onclick="SetToBold ();">Test the state of the 'bold' command</button>
</body>