The spellcheck attribute in HTML specifies that the spelling and grammar of an element should be checked by the browser.
Definition and Usage
➔ It is mainly used with elements that accept user input or are editable.
➔ The spellcheck attribute can be applied to all HTML elements, but its functionality is generally limited to the following:
- All <input> elements (except elements with type="password"), where the spellcheck attribute value is false by default.
- <textarea> element, where the spellcheck attribute value is true by default.
- Elements with the contenteditable attribute set to true , the spellcheck attribute defaults to true.
➔ It is possible to enable or disable spell checking for specific elements or the entire form.
Syntax
//In HTML
<form spellcheck="true">
Name<input type="text" id="name" name="name">
Details:<textarea id="details" name="details"></textarea>
</form>
//OR
<form spellcheck="false">
Comments:<textarea id="comment" name="comment" spellcheck="true"></textarea>
</form>
//In Javascript
const element = document.getElementById('comment');
element.spellcheck = true;
element.spellcheck = false;
//OR
element.setAttribute('spellcheck', 'true');
element.setAttribute('spellcheck', 'false');
Applies to
This attribute can be used on the following element.
| Attribute | Element |
|---|---|
| spellcheck | Global Attributes |
Example
<!DOCTYPE html>
<html>
<head>
<title>HTML spellcheck attribute example</title>
</head>
<body>
<h3>HTML spellcheck attribute example</h3>
<p>The spellcheck attribute provides spelling and grammar checking by the browser.</p>
<div>
<form spellcheck="true">
Name: <input type="text" id="name" name="name"><br><br>
Details: <textarea id="details" name="details"></textarea>
</form>
</div>
</body>
</html>
Click on the "Try it Now" button to see how it works.