でfreecodecamp HTMLチュートリアルのCreate a Set of Radio Buttonsこのセクションでは、我々は、この一節を参照してください
設定することがベストプラクティスと考えているforに属性をlabelの値と一致する値で、要素idの属性input要素を。これは、支援技術は、ラベルと子の間のリンク関係を作成することを可能にするinput要素を。
おそらくそれは意味：最善のアプローチはしているlabel追加し、ラベルfor値が属性inputのタグidラベルと入力との間の関連付けを作成するために、プロパティの同じ値を。
次のように一方、例えばコードスニペットを与えられます。
<!-- Code 1 -->
<label for="indoor">
<input id="indoor" type="radio" name="indoor-outdoor">Indoor
</label>
タグ、属性値の同じプロパティ値。このコード、そしてどこから関連は見られません。プロパティが削除のためにしても、動作させる結果に違いはありません。labelforinputid
ではW3Schoolsの、次のプロパティのラベルの定義：
フォーム要素の属性指定のため 。ラベルがバインドされている
翻訳：属性のバインドにラベルを指定し、どのフォームの要素。
サンプルコード：
<!-- Code 2 -->
<form action="/action_page.php">
<input type="radio" name="gender" id="male" value="male">
<label for="male">Male</label>
<br>
<input type="radio" name="gender" id="female" value="female">
<label for="female">Female</label>
<br>
<input type="radio" name="gender" id="other" value="other">
<label for="other">Other</label>
<br>
<input type="submit" value="Submit">
</form>
提供された定義とサンプルコードW3Schoolsのは、ラベルが入力され、1対1の関係であり、同じ特性およびid属性語について見られることができます。
コードの2枚を比較すると、見つけるのは難しいことではありません、
- ラベルは、入力されたタグと異なる関係が含まれています。含むコード1つのラベルと入力、関係、コードラベルと入力2は比較的独立している属します。
- ページ上の入力配列別のラベル。（I +ショートカットはCtrl + Shiftキー）難しいが、Chromeデベロッパーツールを見つけるために、コード1の結果は、ラベルラベルラベルが結ば操作した結果、ラベルタグとinputタグの入力、コード2が含まれています。
- ラベルと入力-1の対応。ラジオボタンの内容のラベルが選択されているをクリックします。
私たちは、属性を削除するための2つのコードにラベルを付ける場合は、最初の午前3時00内の前のポイント1と変わらない点2、変更。コード1社の業績は、コンテンツのラベルをクリックして、まだラジオボタンを選択することができます。入力は、ラベルに含まれているため。コード2が異なっている、コンテンツのラベルをクリックすると、ラジオボタンを選択することはできません。
コードの実行結果を単純に比較した後、我々は記事の冒頭には、これらの発言が正しい引用を検証することができました。コードの品質を向上させることができ、このアプローチのためのlabel属性に追加します。