본문 바로가기

자바스크립트 기초 1: getElementById

안녕하세요 오늘은 자바스크립트 기초 getElementById() 메서드의 역할을 알려드리겠습니다.

 

해당 메서드 내에 "id"값을 입력할 경우ex. getElementById('test') 

 

test에 해당하는 id를 가진 요소를 변경할 수 있는데요.

 

간단한 예제를 보여 드리겠습니다. 

 

예를 들어 <p id="test">변경될 아이</p> 라는 test라는 id를 가진 요소가 있을때,

 

<button type="button" onclick="document.getElementById('test').innerHTML = '변경할 아이'">클릭하세요!</button>

 

라는 버튼을 선택하게되면

 

test라는 id를 가지고 있던 변경될 아이 문구가 변경할 아이로 변경되는 것을 보실 수 있습니다.

 

이처럼 getElementById 메서드는 id값을 찾아 그 id에 해당하는 요소 변경할 수 있는 메서드 입니다.