우리는 앞서 확인했던 것처럼 html의 요소들을 가져올 수 있다. 이번엔 h1을 가져온다고 하자.

<h1 id="title">I got you!</h1>

const title = document.getElementId('title');

console.log(title);

이렇게 하면 콘솔창에 title이 뜬다. 우리는 id를 통해 element를 찾고 싶을때 getElementId함수를 통해 찾아 줄 것이다. 사실 이 함수 말고도 다른 방식으로 찾는 방법도 있기때문에 다양한 함수들이 존재한다!

하지만 우리는 이것 말고도 이 id=”title”인 h1요소를 가지고와서 세부 정보도 보고싶다. 그럴땐 어떻게 해야할까? console.dir(title)을 통해 볼 수 있다. console.dir(title)을 하면

id=”title”인 요소의 상세정보를 이렇게 보여준다. 우리가 자세히 보아야할 점은

textContent다. textContent를 우리는 바꿀 수가 있다.

이렇게 우리는 html에서 항목들을 가지고 와서, js를 통해 항목들을 변경할 것이다.