Computer >> 컴퓨터 >  >> 프로그램 작성 >> JavaScript

JavaScript에서 getElementByID는 어떻게 작동합니까?

<시간/>

getElementById

getElementById() DOM 메소드 지정된 값을 가진 ID 속성이 있는 요소를 반환하는 데 사용됩니다. 이것은 HTML DOM에서 가장 일반적인 방법 중 하나입니다. 문서의 요소를 조작할 때마다 거의 사용됩니다. 이 메소드는 null 을 반환합니다. 지정된 ID를 가진 요소가 없는 경우. ID는 페이지 내에서 고유해야 합니다. 그러나 지정된 ID를 가진 요소가 두 개 이상 존재할 경우 자바스크립트 코드의 마지막 요소를 반환합니다.

예시-1

다음 예에는 내부 텍스트가 "GetElementById"이고 ID가 "element"인 단락 태그가 있습니다. DOM 메서드 "document.getElementById()"를 사용하여 단락 태그 내부의 텍스트에 액세스하고 값이 출력에 표시됩니다. ".innerHtml"이 없으면 document.getElementById는 태그의 내부 텍스트 부분을 읽을 수 없습니다.

<html>
<body>
<p id="element">GetElementById</p>
<script>
   var s = document.getElementById("element").innerHTML;
   document.write(s);
</script>
</body>
</html>

출력

GetElementById
GetElementById

예시-2

다음 예에서는 DOM 메서드 "getElementById"를 사용하여 원본 텍스트 부분 "GetElementById"를 "Tutorix" 텍스트로 바꾸고 결과가 출력에 표시됩니다.

<html>
<body>
<p id="element">GetElementById</p>
<script>
   document.getElementById("element").innerHTML = "Tutorix";
</script>
</body>
</html>

출력

Tutorix