HTML DOM Methods and Properties - 1

박종한·2020년 3월 10일

DOM

목록 보기

2/12

Methods는 HTML 요소에 대해 수행할 수 있는 어떤 Actions을 말합니다.

Properties는 HTML 요소 속에 바꾸거나 설정할 수 있는 values를 말합니다.

이 HTML DOM은 Javascript를 통해 접근할 수 있습니다.
DOM에서는 모든 HTML 요소들이 객체로서 정의됩니다.

<html>
<body>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = "Hello World!";
</script>

</body>
</html>

위 예제는 demo라는 아이디를 가지는 p태그에 대해서 안의 내용물을 Hello World로 변경하는 예제입니다.

여기서 getElementById()는 HTML 요소에 취할 수 있는 Action이므로 methods중 하나입니다.

그리고, innerHTML는 내용물을 설정, 변경하는 value이므로, 이는 values중 하나입니다.

getElementById method는 HTML 요소에 접근하는 가장 흔한 방법으로 요소의 id를 이용하는 방법입니다.

위 예제에서도 getElementById("demo")를 입력함으로써, demo라는 id를 가진 요소에 접근했습니다.

innerHTML은 요소의 내용물을 얻는 가장 쉬운 방법입니다. HTML 요소의 내용물을 얻거나 수정하고 싶을때 유용합니다. innerHTML property는 html태그와, body태그를 포함한 모든 HTML 요소에서 사용될 수 있습니다.

코딩의 고수가 되고 싶은 종한이