javascript_DOM

DOM(Document Object Model)

• 브라우저가 HTML 코드를 해석하여 요소들을 트리 형태로 구조화해 표현하는 객체(문서)를 생성하는데 이것을 DOM 이라고 함
• 브라우저는 DOM을 통해 화면에 웹 콘텐츠들을 렌더링함
• 웹 콘텐츠를 추가, 수정, 삭제하거나 마우스 클릭, 키보드 타이핑 등의 이벤트에 대한 처리를 정의할 수 있도록 제공되는 프로그래밍 인터페이스 임
  (js를 이용하여 추가, 수정, 삭제, 이벤트 처리 등을 함)
  
  

DOM 에 접근하기_window.document

• 창이 포함한 문서를 참조함
• window.document는 현재 브라우저에 렌더링되고 있는 문서를 의미
• 이 속성을 이용하면 해당 문서에 접근할 수 있음
• 페이지 콘텐츠, 즉 DOM 에 대한 진입점 역할을 하는 프로그래밍 인터페이스
• 이를 이용해 페이지의 정보를 얻거나 웹 요소를 생성 및 조작할 수 있음
  
  

querySelector

// p 태그 선택
document.querySelector("p");

// id가 id2인 요소를 선택
document.querySelector(#id2);

textContent

• 객체(요소)가 포함하고 있는 텍스트 콘텐츠를 표현하는 속성
• 이를 통해 요소가 표함한 텍스트를 읽거나 변경 가능