HTML | DOM Input Radio Object
Last Updated :
26 Aug, 2022
The Input Radio object is used to access or create an input element with type=”radio”. Syntax:
- To Access input element type=”radio”.
document.getElementById("ID");
- To create input element type=”radio”.
var GFG = document.createElement("INPUT");
x.setAttribute("type", "radio");
Property Values:
Value |
Description |
autofocus |
It states if a radio button should automatically get focus when the page loads. |
checked |
It returns the checked state of a radio button. |
defaultChecked |
It returns the default value of the checked attribute. |
defaultValue |
It returns the default value of a radio button. |
disabled |
It returns if the radio button is disabled, or not. |
form |
It returns a reference to the form that contains the radio button. |
name |
It returns the value of the name attribute of a radio button. |
required |
It returns if the radio button must be checked before submitting a form. |
type |
It returns which type of form element the radio button is. |
value |
It returns the value of the value attribute of the radio button. |
Example-1: Accessing input object type=”radio”
HTML
<!DOCTYPE html>
< html >
< head >
< style >
body {
text-align: center;
}
h1 {
color: green;
}
</ style >
</ head >
< body >
< h1 >GeeksforGeeks</ h1 >
< h2 >HTML DOM Input Radio Object</ h2 >
< h3 >An example access a Radio Button</ h3 >
Radio Button:
< input type="radio"
checked = true
id="radioID">
< p >Click the button to uncheck it.</ p >
< button onclick="GFG()">
Click!
</ button >
< script >
function GFG() {
// Accessing input element
// type="radio"
var x =
document.getElementById("radioID");
x.checked = false;
}
</ script >
</ body >
</ html >
|
Output:
Before click:
After click:
Example-2: Creating input element type=”radio”.
HTML
<!DOCTYPE html>
< html >
< head >
< style >
body {
text-align: center;
}
h1 {
color: green;
}
</ style >
</ head >
< body >
< h1 >GeeksforGeeks</ h1 >
< h2 >HTML DOM Input Radio Object
</ h2 >
< p >Click to create a Radio Button.
</ p >
< button onclick="myFunction()">
Create
</ button >
< br >
< script >
function myFunction() {
// Creating input element
// type="radio"
var x =
document.createElement("INPUT");
x.setAttribute("type", "radio");
document.body.appendChild(x);
}
</ script >
</ body >
</ html >
|
Output:
Before click:
After click:
Supported Browsers:
- Google Chrome
- Mozilla Firefox
- Edge 12+
- Safari
- Opera
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...