DOM 복습하기

DOM이란?

DOM은 Document Object Model의 약자로, HTML 요소를 Object처럼 조작할 수 있는 Model입니다. 즉, 자바스크립트를 사용할 수 있으면, DOM으로 HTML을 조작할 수 있습니다.

DOM, 자바스크립트로 조작하기

• • createElement - CREATE
  • querySelector, querySelectorAll - READ
  • textContent, id, classList, setAttribute - UPDATE
  • remove, removeChild, innerHTML = "" , textContent = "" - DELETE
  • appendChild - APPEND
  • innerHTML과 textContent의 차이
    • innerHTML은 문자열 내에 포함된 HTML 태그를 함께 반환합니다.
    • innerText는 내용만 반환합니다.
    • textContent는 내용과 내용의 스타일을 반환합니다.
      • 예시 코드

    • // getValue.innerHTML
      This element is <strong>strong</strong> and has    some super fun <code>code</code>!
      
      // getValue.innerText
      This element is strong and has some super fun code!
      
      // getValue.textContent
      This element is strong and     has some super fun code!

https://mari-mo.tistory.com/62?category=488313 

DOM(Document Object Model)

DOM과 Javascript의 차이

DOM은 브라우저의 독립적인 방식으로 HTML/XML 문서의 구조를 나타냅니다. Javascript는 웹 브라우저에서 실행할 수 있는 프로그래밍 언어로 DOM과 상호작용할 수 있습니다. 자바스크립트를 사용하여 DOM 스크립팅을 수행할 수 있습니다.

 

DOM stands for Document Object Model and, as you could guess from the name, represents the structure of an HTML/XML document in a platform/browser independent way. The DOM also provides an API to manipulate the DOM, with functions like getElementsByTagName and createElement.

JavaScript is a programming language that web browsers can execute. JavaScript can interact with the DOM with DOM scripting.

https://stackoverflow.com/questions/2726554/what-is-the-difference-between-javascript-and-dom/2726645

What is the difference between JavaScript and DOM?