HTML | DOM Input Radio checked Property

17 Oct, 2019
The DOM Input Radio checked Property in HTML DOM is used to set or return the checked state of an Input Radio Button. This Property is used to reflect the HTML checked attribute.
Syntax:
It returns the checked property.radioObject.checked
radioObject.checked
It is used to set the checked property:radioObject.checked = true|false
radioObject.checked = true|false
Property Values:
true: It specifies that a radio button is checked.
false: It has a Default Value. It specify that the radio button is not checked.
Return value: It returns a Boolean value which represents that the radio button is checked or not.
Example-1: This Example illustrates how to return the Property.
<!DOCTYPE html><html>  <head>    <style>        body {            text-align: center;        }                  h1 {            color: green;        }    </style></head>  <body>    <h1>      GeeksforGeeks  </h1>      <h2>      HTML DOM Input Radio Checked Property  </h2>      <form id="myGeeks">        Radio Button:        <input type="radio"                checked=true                id="radioID"                value="Geeks_radio"               name="Geek_radio"                disabled>        <br>        <br>    </form>    <button onclick="GFG()">        Click!    </button>    <p id="GFG"        style="font-size:25px;              color:green;">  </p>    <script>        function GFG() {              // Accessing input element             // type="radio"             var x =                document.getElementById(                  "radioID").defaultChecked;                        document.getElementById(              "GFG").innerHTML = x;        }    </script>  </body>  </html>
Output:Before Clicking On Button:
After Clicking On Button:
Example-2: This Example illustrates how to set the Property.
<!DOCTYPE html><html>  <head>    <style>        body {            text-align: center;        }                  h1 {            color: green;        }    </style></head>  <body>    <h1>GeeksforGeeks</h1>      <h2>HTML DOM Input Radio  Checked Property</h2>      <form id="myGeeks">        Radio Button:        <input type="radio"               id="radioID"                value="Geeks_radio"                name="Geek_radio"                checked>        <br>        <br>    </form>    <button onclick="GFG()">        check    </button>    <button onclick="uncheck()">        uncheck    </button>    <p id="GFG"        style="font-size:25px;              color:green;">  </p>    <script>        function GFG() {              // Accessing input element             // type="radio"             document.getElementById(              "radioID").checked = "true";        }          function uncheck() {            document.getElementById(              "radioID").checked = false;        }    </script>  </body>  </html>
Output:Before Clicking On check Button:
After Clicking On check Button:
After Clicking On uncheck button:
Supported Browsers: The browser supported by DOM input Radio checked property are listed below:
Google Chrome
Internet Explorer 10.0 +
Firefox
Opera
Safari
shubham_singh
HTML-DOM
HTML
Web Technologies
HTML
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
How to update Node.js and NPM to next version ?
REST API (Introduction)
CSS to put icon inside an input element in a form
Types of CSS (Cascading Style Sheet)
Design a Tribute Page using HTML & CSS
Installation of Node.js on Linux
Difference between var, let and const keywords in JavaScript
How to fetch data from an API in ReactJS ?
Differences between Functional Components and Class Components in React
Remove elements from a JavaScript Array