What is the purpose of “linking” elements with “for” and “id” ()?
fCC is saying " The
id attribute is used to identify specific HTML elements. Each
id attribute’s value must be unique from all other
id values for the entire page.
id attribute with the value
indoor to the radio button. When elements have multiple attributes, the order of the attributes doesn’t matter.
- Why do I need to add an “id” attribute as opposed to a “name” attribute? Aren’t they the same thing essentially? My code already has “Indoor” written as text:
<label><input type="radio"> Indoor</label>
Why can’t I just leave it like that ? (Why the “id” attribute?)
Linking a label to an input allows people using assistive technology (such as screen readers) to know what the input is for. Technically, if you nest the input inside of the label then you shouldn’t need the
for attribute on the label because the link between the two should be implied. But there are a few very specific situations in which the implication doesn’t always work. So it is considered a best practice to always link the label to its input using the
for attribute only works when its value is set to the
id of the input. It doesn’t work with the
you can absolutely do that, but when you need to use “label” and “input” separately you need to have a way of “linking” these two elements together, and thats what you do with “for and id” attributes in “label and input” elements
also for “accessibility” and “conventional” uses its customary that we use “linking” between label and input elements in html
perhaps consider reading through this mdn article, would be helpful, <input>: The Input (Form Input) element - HTML: HyperText Markup Language | MDN happy reading