The queryCommandSupported() method checks whether the specified editor command is supported by the browser or not.
Syntax:
check = document.queryCommandSupported(command);
Parameters: This method accept single parameter command that holds the command for which we want to decide if the browser supports.
Return value:
- true , if the command is supported by the browser.
- false, if the command is not supported by the browser.
Example 1: This example demonstrates the ueryCommandSupported() method when it returns true.
It will show if the command is supported or not, we will check for “SelectAll” command and then we will execute that command by execCommand() method.
<!DOCTYPE html> <html>
<head>
<title>
HTML DOM range
queryCommandSupported() method
</title>
</head>
<body>
<h1>GeeksforGeeks</h1>
<p>
A<br>
B<br>
</p>
<button onclick="sel()">Click</button>
<script>
function sel() {
var check = document
.queryCommandSupported("SelectAll");
console.log(check);
if (check) {
document.execCommand(
"SelectAll", false, null);
}
}
</script>
</body>
</html>
|
Output:
-
Before Click the Button:
-
After Click the Button: In console, the true boolean value can be seen, as the command is supported by the browser.
Example 2: In this example, this method will return “false” as the command is not be supported by the browser.
<!DOCTYPE html> <html>
<head>
<title>
HTML DOM range
queryCommandSupported() method
</title>
</head>
<body>
<h1>GeeksforGeeks</h1>
<p>
A<br>
B<br>
</p>
<button onclick="sel()">Click</button>
<script>
function sel() {
var check = document
.queryCommandSupported("Select");
console.log(check);
}
</script>
</body>
</html>
|
Output:
-
Before Click the Button:
-
After Click the Button: In this example command is not supported and invalid,so the method returns false.
Supported Browsers: The browsers supported by DOM queryCommandSupported() method are listed below.
- Google Chrome
- Edge
- Firefox
- Safari
- Opera
- Internet Explorer