HTML - checked Attribute



HTML checked attribute is a boolean attribute that indicates whether a checkbox is checked by default (when the page loads).

We can use the checked attribute with a JavaScript conditional statement to verify whether a checkbox or radio button is checked. It returns true if the checkbox or radio button is checked otherwise false.

Syntax

<input type = "checkbox/radio" checked/>

Applies On

Below listed element allow using of the HTML checked attribute.

Element Description
<input> HTML <input> tag is used to specify the input field.

Examples of HTML checked Attribute

The following codes demonstrate the usage of checked attribute in HTML

Checked attribute for checkbox type

In the following example, we are using the HTML 'checked' attribute inside an input (type='checkbox') element to make it checked by default.

<!DOCTYPE html>
<html lang="en">

<head>
   <title>HTML checked attribute</title>
</head>

<body>
   <!--example of the checked attribute-->
   <form> Select languages that you know: <br>
      <input type="checkbox" checked> Hindi  <br>
      <input type="checkbox"> English <br>
      <input type="checkbox"> Marathi <br>
      <input type="checkbox"> Telugu
   </form>
</body>

</html>

Checked attribute for radio Button

Consider the another scenario, where we are going to use the checked attribute with the radio button.

<!DOCTYPE html>
<html lang="en">

<head>
   <title>HTML checked attribute</title>
</head>

<body>
   <!--Example of the checked attribute-->
   <form> Choose your gender: <br>
      <input 
         type="radio" 
         name='gender' 
         checked> Male <br>
      <input 
         type="radio" 
         name='gender'> Female
   </form>
</body>

</html>

Supported Browsers

Attribute Chrome Edge Firefox Safari Opera
checked Yes Yes Yes Yes Yes
html_attributes_reference.htm
Advertisements