HTML DOM getElementById() 메서드

정의와 사용법

getElementById() 메서드는 지정된 ID를 가진 첫 번째 객체에 대한 참조를 반환합니다.

문법

document.getElementById(id)

설명

HTML DOM은 getElementById() 외에도 getElementsByName()와 getElementsByTagName()와 같은 여러 가지 요소 검색 방법을 정의했습니다.

그러나 문서에서 특정 요소를 찾아야 할 때 가장 효율적인 방법은 getElementById()입니다.

문서의 특정 요소를 처리할 때, 그 요소에 id 속성을 주고(문서에서) 독특한 이름을 지정하는 것이 가장 좋습니다. 그런 다음 해당 ID를 사용하여 원하는 요소를 찾을 수 있습니다.

예제

예제 1

<html>
<head>
<script type="text/javascript">
function getValue()
  
  var x=document.getElementById("myHeader")
  alert(x.innerHTML)
  



<h1 id="myHeader" onclick="getValue()">이것은 헤더입니다</h1>
<p>헤더를 클릭하여 값을 알림</p>

예제 2

getElementById()는 중요한 메서드로, DOM 프로그래밍에서 매우 일반적으로 사용됩니다. 이를 통해 요소를 빠르게 사용할 수 있도록 도구 함수를 정의했습니다:

function id(x) {
  if (typeof x == "string") return document.getElementById(x)
  return x;

위의 함수는 요소 ID를 인자로 받습니다. 이러한 인자의 경우, 사용 전에만 x = id(x)를 작성하면 됩니다.

TIY

getElementById() 사용