Radio buttons allow you to select only one of a predefined set of mutually exclusive options. To create a radio button you use the
<input type="radio"> element. For example:
You use a name to form a group of radio buttons. In a group, you can only select one radio button.
To find the selected radio button, you use these steps:
- Select radio buttons by using DOM methods such as
- Get the
checkedproperty of the radio button. If the
true, the radio button is checked; otherwise, it is not.
To know which radio button is checked, you use the
value attribute. For example:
How it works.
- First, register an event listener to the button with id
- Second, use the
querySelectorAll()method to select the radio button group with the name
- Third, iterate over the radio button groups and get the value of the selected radio button.
- Use the name attribute of the
<input type="radio">element to form a group of radio buttons
- Use checked property of the radio button to check if the radio button is checked.