ホームページ > 記事 > ウェブフロントエンド > HTMLの名前、ID、クラスの違いは何ですか?

HTMLの名前、ID、クラスの違いは何ですか?

php中世界最好的语言オリジナル: 2018-01-17 09:50:022821ブラウズ

今回は、HTMLでの名前、ID、クラスの違いは何ですか？名前、ID、クラスを使用するときの注意事項は何ですか?実際のケースを見てみましょう。

name

ラベルの名前を指定します。

フォーマット

<input type="text" name="username" />

アプリケーションシナリオ

①フォームフォーム: 名前はサーバーフォームリストに転送される変数名として使用できます。たとえば、上記のサーバーに転送される名前は次のようになります。。

②Input type='radio' ラジオ選択ラベル: 複数のラジオ選択ラベルの名前が同じ値に設定されている場合、ラジオ選択動作が実行されます。

<input type="radio" name=&#39;sex&#39;/>男
<input type="radio" name=&#39;sex&#39;/>女

③同じ名前のタグのグループをすばやく取得: 同じ名前のタグを取得し、属性の変更、イベントの登録などの操作をまとめて実行します。

function changtxtcolor() {
    var txts = document.getElementsByName(&#39;txtcolor&#39;); //获取所有name=txtcolor 的标签
    for (var i = 0; i < txts.length; i++) { //循环遍历标签，并把背景色改为red
        txts[i].style.backgroundColor = &#39;red&#39;;
    }
}

特徴

name 属性の値は現在のページ内で一意ではありません。

タグの一意の識別子を指定します。

フォーマット

<input type=password  id="userpwd" />

アプリケーションシナリオ

①提供された一意のID番号に基づいてタグオブジェクトを迅速に取得します。例: document.getElementById(id)

②は、ラベル label の for 属性の値として使用されます: 例: d305c5282d143dd49e6374acc3c8c7aaUsername: 8c1ecd4bb896b2264e0711597d40766c。これは、次の場合を意味します。このラベルがクリックされると、ID userid を持つタグがフォーカスを取得します。
機能

id 属性の値は、現在のページ内で一意である必要があります。

class

ラベルのクラス名を指定します。

フォーマット