HTML에서 이름, ID, 클래스의 차이점 소개

　한 페이지에는 많은 컨트롤(요소 또는 레이블)이 있습니다. 이러한 태그를 보다 편리하게 작동하려면 해당 태그에 식별 태그를 표시해야 합니다.

Directory

1. 이름: 라벨의 이름을 지정합니다.

2.id: 태그의 고유 식별자를 지정합니다.

3. 클래스: 라벨의 클래스 이름을 지정합니다.

1. name

라벨의 이름을 지정하세요.

1.1 형식

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

1.2 응용 시나리오

①form form: name은 서버 양식 목록에 전달되는 변수 이름으로 사용할 수 있습니다. 예를 들어 위의 서버에 전달되는 이름은 다음과 같습니다. '.

②input type='radio' 라디오 태그: 여러 라디오 태그의 이름이 동일한 값으로 설정되면 라디오 선택 작업이 수행됩니다.

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

③동일한 이름을 가진 태그 그룹 빠르게 가져오기: 동일한 이름의 태그를 가져와 속성 변경, 이벤트 등록 등의 작업을 함께 수행합니다.

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

1.3 기능

이름 속성의 값이 현재 페이지에서 고유하지 않습니다.

2.id

는 태그의 고유 식별자를 지정합니다.

2.1 형식

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

2.2 적용 시나리오

①제공된 고유 ID 번호를 기반으로 태그 개체를 빠르게 가져옵니다. 예: document.getElementById(id)

②는 레이블 레이블의 for 속성 값으로 사용됩니다. 예: d305c5282d143dd49e6374acc3c8c7aa 사용자 이름: 8c1ecd4bb896b2264e0711597d40766c 이 라벨을 클릭한다는 의미입니다. label 언제, ID가 userid인 라벨에 포커스가 맞춰집니다.

2.3 기능

id 속성의 값은 현재 페이지에서 고유해야 합니다.

3.class

레이블의 클래스 이름을 지정합니다.

3.1 형식

<input type=button 
class
="btnsubmit" />

3.2 응용 시나리오

①CSS 작업, 특정 스타일을 클래스 클래스에 넣고 이 스타일이 필요한 태그에 이 클래스를 추가할 수 있습니다.

3.3 기능

하나의 클래스 속성에 여러 클래스를 넣을 수 있지만 다음과 같이 공백으로 구분해야 합니다.

위 내용은 HTML에서 이름, ID, 클래스의 차이점 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!