HTML | DOM Input Radio Object
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 >w3wiki</ 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 >w3wiki</ 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