[JavaScript] HTML 요소에 접근하기

1. 접근하기

메서드	설명
document.getElementById(“id명”)	해당 id 명을 가진 요소 하나를 반환
document.querySelector(“선택자”)	해당 선택자를 만족하는 요소 하나를 반환
document.getElementsByClassName(“class명”)[순서]	해당 class명을 가진 요소들을 배열에 담아 인덱스에 맞는 요소 반환
document.getElementsByTagName(“태그명”)[순서]	데이터를 담는 용기, 서버에서 가져온 데이터를 자바스크립트 객체로 저장
document.querySelectorAll(“선택자명”)[순서]	뷰(View)에 표시되는 내용과 모델의 데이터를 동기화

<div>
  <button id="buttonId" class="buttonClass">버튼</button>
</div>

<sciprt>
  console.log(document.getElementById("buttonId"));
  console.log(document.querySelector("#buttonId"));
  console.log(document.getElementsByClassName("buttonClass"));
  console.log(document.getElementsByTagName("button"));
  console.log(document.querySelectorAll(".buttonClass"));
</sciprt>