HTML에서 이름, ID 및 클래스의 차이점은 무엇입니까?
- php中世界最好的语言원래의
- 2018-01-17 09:50:022821검색
이번에는 HTML에서 이름, ID, 클래스의 차이점이 무엇인지 보여드리겠습니다. 이름, 아이디, 클래스 사용 시 주의사항은 무엇인가요? 실제 사례를 살펴보겠습니다.
name
라벨 이름을 지정하세요.
Format
<input type="text" name="username" />
응용 시나리오
①form form: name은 서버 양식 목록으로 전송되는 변수 이름으로 사용할 수 있습니다. 예를 들어 위의 서버로 전송되는 이름은 다음과 같습니다. .
②입력 유형='라디오' 라디오 선택 라벨: 여러 라디오 선택 라벨의 이름이 동일한 값으로 설정되면 라디오 선택 작업이 수행됩니다.
<input type="radio" name='sex'/>男 <input type="radio" name='sex'/>女
③동일한 이름을 가진 태그 그룹을 빠르게 가져오기: 동일한 이름을 가진 태그를 가져와 함께 작업(예: 속성 변경, 이벤트 등록 등)을 수행합니다.
function changtxtcolor() {
var txts = document.getElementsByName('txtcolor'); //获取所有name=txtcolor 的标签
for (var i = 0; i < txts.length; i++) { //循环遍历标签，并把背景色改为red
txts[i].style.backgroundColor = 'red';
}
}Features
이름 속성의 값이 현재 페이지에서 고유하지 않습니다.
id
태그의 고유 식별자를 지정합니다.
Format
<input type=password id="userpwd" />
Application Scenario
①제공된 고유 ID 번호를 기반으로 태그 개체를 빠르게 가져옵니다. 예: document.getElementById(id)
②는 레이블 레이블의 for 속성 값으로 사용됩니다. 예: d305c5282d143dd49e6374acc3c8c7aa사용자 이름: 8c1ecd4bb896b2264e0711597d40766c 이 라벨을 클릭하면 ID가 userid인 태그가 포커스를 받습니다.
기능
id 속성의 값은 현재 페이지에서 고유해야 합니다.
class
레이블의 클래스 이름을 지정하세요.
Format
<input type=button class="btnsubmit" />
응용 시나리오
①CSS 작업, 클래스에 특정 스타일을 추가합니다. 이 스타일의 태그가 필요한 경우 이 클래스를 추가할 수 있습니다.
Features
하나의 클래스 속성에 여러 클래스를 넣을 수 있지만 다음과 같이 공백으로 구분해야 합니다. class='btnsubmit btnopen'
이 사례를 읽으신 후 방법을 마스터하셨다고 생각합니다. 더 많은 클래스를 보려면 여기로 오세요. 흥미로운 정보 PHP 중국어 웹사이트의 다른 관련 기사도 주목하세요!
관련 읽기:
HTML+CSS를 사용하여 마우스를 스와이프하여 보조 메뉴 표시줄을 표시하는 방법
이 경우 수행할 작업 H5 Solve의 이미지에 공백이 있습니다
위 내용은 HTML에서 이름, ID 및 클래스의 차이점은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!