input_HTML/Xhtml_Web 페이지 제작 시 id와 name 속성의 차이점에 대한 소개 예

오랫동안 웹사이트를 구축해 왔지만 입력 시 이름과 ID의 차이를 아직도 파악하지 못하고 최근에 jquery를 배우다가 또 이런 문제가 발생해서 온라인으로 정보를 수집했습니다. 이 글을 보고 나중에 활용하기 위해 정리했습니다.

웹 개발을 해본 거의 모든 사람들이 요소의 ID와 이름의 차이점이 무엇인지 물어봤다고 할 수 있습니다. ID가 있는데 왜 이름이 필요한가요?! 그리고 가장 고전적인 대답도 얻을 수 있습니다. ID는 사람의 ID 번호와 같고 이름은 ID와 같으며 이름은 반복 가능합니다.

지난 주에도 ID와 이름 문제가 발생했습니다. 페이지에 입력 유형="hidden"을 입력하고 ID='SliceInfo'만 작성하고 값을 할당한 후 요청을 제출하고 사용하세요. Params["SliceInfo"]는 값을 가져올 수 없습니다. 나중에 갑자기 Name으로 표시해야 한다는 것을 깨달았기 때문에 입력에 Name='SliceInfo'를 추가했는데 모든 것이 정상이었습니다.

첫 번째 문단의 ID와 Name에 대한 답변은 너무 일반적입니다. 물론 클라이언트측 HTML 요소의 ID인 ID에 대한 설명은 완전히 맞습니다. Name은 실제로 훨씬 더 복잡합니다. Name은 용도가 다양하고 ID로 완전히 대체할 수 없으므로 취소됩니다. 구체적인 용도는 다음과 같습니다.

사용 1: 입력, 선택, 텍스트 영역 및 버튼과 같이 서버와 상호 작용할 수 있는 HTML 요소의 서버 측 표시기로 사용됩니다. 서버 측 이름을 기반으로 Request.Params를 통해 요소가 제출한 값을 얻을 수 있습니다.
사용 2: HTML 요소 입력 유형='라디오' 그룹화, 라디오 버튼 컨트롤이 동일한 그룹화 클래스에 있고 확인 작업이 뮤텍스이며 동시에 하나의 라디오만 선택할 수 있다는 것을 알고 있습니다. 이 그룹화는 동일한 Name 속성을 기반으로 구현되었습니다.
사용 3: 페이지에 앵커 포인트를 설정합니다. 링크 대신 < ;a name="PageBottom">과 같이 페이지 앵커를 얻습니다.
사용 4: Applet, Object, Embed 및 기타 요소와 같은 객체로서의 ID입니다. 예를 들어 Applet 객체 인스턴스에서는 이름을 사용하여 객체를 참조합니다.
목적 5: IMG 요소와 MAP 요소를 연관시킬 때 IMG의 핫스팟 영역을 정의하려면 해당 속성인 usemap을 사용해야 하므로 usemap="#name"(연관된 MAP 요소의 이름) ).
사용 6: 속성, 메타, 매개변수 등 특정 특정 요소의 속성. 예를 들어, 객체에 대해 또는 메타에서

분명히 이러한 용도는 단순히 ID로 대체할 수 없으므로 HTML 요소의 ID와 이름의 차이는 ID 번호와 이름의 차이가 아닙니다.

물론 HTML 요소의 Name 속성은 페이지에서 ID 역할을 할 수도 있습니다. 왜냐하면 DHTML 개체 트리에서는 document.getElementsByName을 사용하여 지정된 모든 Name을 포함하는 개체 배열을 얻을 수 있기 때문입니다. 페이지의 요소. Name 속성에는 또 다른 문제가 있습니다. Name 속성을 포함할 수 있는 요소를 동적으로 생성할 때 단순히 name 속성을 추가하기 위해 element.name = "..."을 사용할 수는 없습니다. 요소를 생성하면 '') 요소에 Name 속성이 추가됩니다. 이것은 무엇을 의미합니까? 이해하려면 아래 예를 살펴보십시오.

코드 복사

코드는 다음과 같습니다.

var input = document.createElement('INPUT');
input.id = 'myId';
input.name = 'myName';
alert(input.outerHTML) ;

메시지 상자에 표시되는 결과는 입니다.

코드 복사

코드는 다음과 같습니다.

var input = document.createElement('');
input.id = 'myId';
alert(input.outerHTML);
< ; /스크립트>

메시지 상자에 표시되는 결과는 입니다.
Name 속성을 초기화하는 디자인은 MSDN에서 이렇게 해야 한다고 해서 IE의 결함은 아니지만, 이 디자인의 원리는 무엇인가요? 나는 아직 명확하게 생각하지 않았습니다.

그런데 페이지에 동일한 ID를 가진 n(n>1) 개의 HTML 요소가 있다면 어떻게 될까요? DHTML 개체에서 이를 참조하는 방법은 무엇입니까? ASPX 페이지를 사용하는 경우 aspnet 프로세스는 aspx 페이지를 처리할 때 고유하지 않은 ID를 허용하지 않기 때문에 이러한 상황이 발생하기 쉽지 않습니다. 이는 페이지에서 예외가 발생하고 정상적으로 렌더링될 수 없음을 의미합니다. 동적 페이지가 아니고 ID를 반복해야 한다면 IE는 어떻게 해야 할까요? 현재로서는 document.getElementById를 사용하여 객체를 얻을 수 있지만, ID가 중복된 객체 중 HTML Render 중에 나타나는 첫 번째 객체만 얻을 수 있습니다. 이때, 반복되는 ID는 참조 시 자동으로 배열이 되며, 반복되는 ID를 가진 요소들은 Render 순으로 배열에 존재하게 됩니다.

양식 요소(양식 입력 텍스트 영역 선택)와 프레임 요소(iframe 프레임)라는 이름이 지정됩니다.
이러한 요소는 양식 제출과 관련이 있습니다(프레임 요소는 양식의 수신 페이지에서 작동함).
이름이 있는 요소만 받습니다. ID가 지정된 요소는 양식을 통해 값을 받을 수 없습니다.
예외가 있습니다. A는 앵커 또는 ID로 이름을 지정할 수 있습니다. >
물론 위 요소에도 ID 값을 할당할 수 있습니다. ID 값을 할당할 때 해당 요소를 참조하는 방법이 변경됩니다.
이름 지정: document.formName.inputName document.frames("frameName")
ID 할당: document.getElementById("inputID") document.all.frameID

ID만 할당 가능, 이름 할당 불가: (양식 관련 요소 제외, ID만 할당 가능)
body li table tr td th p divspan pre dl dt dd 글꼴 b 등