Tag <label> biasanya bisa kita temui di form. Mungkin di antara kita masih ada yang mengira bahwa tag <label> dengan dan tanpa for sama saja.
Sebenarnya atribut for pada <label> berguna untuk membuat <label> clickable dan menghubungkannya dengan suatu form elemen (biasanya elemen input) yang mempunyai id yang sama dengan nilai for. Dengan ini area click dari suatu elemen akan bertambah.
Kegunaan lainnya ialah untuk membantu pengguna screen reader. Atribut for akan membuat screen reader membacakan label dengan keras ketika pengguna memfokuskan elemen.
Contoh penggunaannya ialah seperti ini:
<label for="lfname">First name:</label>
<input id="lfname" name="fname" type="text" />Demo: https://www.w3docs.com/tools/editor/230
Sebenarnya penghubungan elemen ini juga bisa dilakukan seperti ini:
<label>Input here:
<input type='text' name='theinput' id='theinput'>
</label>Ini akan benar-benar terasa kegunaannya ketika kita menggunakan checkbox dan radio button. Atribut for membuat kita bisa mengisi checkbox dan radio button hanya dengan mengklik labelnya saja tanpa perlu mengklik kotak checkbox atau bulatan radio button.
<input type="radio" id="male" name="gender" value="male">
<label for="male">Male</label><br>
<input type="radio" id="female" name="gender" value="female">
<label for="female">Female</label><br>
<input type="radio" id="other" name="gender" value="other">
<label for="other">Other</label>Demo: https://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_input_type_radio
Sumber:
https://stackoverflow.com/a/18432439.
