document
-
DOM - 요소노드에 대한 접근프론트엔드/DOM 2020. 10. 7. 01:32
'DOM'은 'HTML' 문서의 요소와 내용들을 객체화시킨 것이다. 그리고 이러한 객체에 접근하여 컨트롤을 해줄 수 있다. 그리고 이때 접근하기 쉽게 메서드와 프로퍼티가 제공된다. 여기서는 문서의 요소(Element) 노드에 어떻게하면 접근할 수 있는지를 알아본다. 단일 요소에 접근하기 1. getElementById() 대략 해석해서 쓰자면 다음과 같다. '파라미터로 주어진 문자열과 동일한 id값를 통해 요소를 얻을 수 있게 한다.' 'getElementById()'에 제공한 문자열과 동일한 'id' 속성을 가진 요소를 HTML 문서에서 찾아준다. 그리고 이 'id' 속성을 가진 'Element' 객체를 반환한다. 즉 해당 요소를 이용할 수 있게 도와준다는 말이다. ID테스트입니다. 코드는 위와 같다...
-
DOM에 관해서프론트엔드/DOM 2020. 10. 7. 00:15
DOM이란? 이미 블로그에서 여러 차례 정리했지만, 'DOM'이란 것이 중요하다보니 다시 다루고자 한다. 'DOM'은 'Document Object Model'의 약자로 풀이하자면 문서 객체 모델이다. 웹페이지를 만들 때 3요소라는 'HTML', 'CSS', '자바스크립트'는 사실 서로 다른 개념이다. 'HTML' 문서 내에서 보통 세 가지를 모두 쓰다보니 햇갈릴 수 있지만 셋은 다른 언어다. 물론 세 언어는 서로 이용적인 측면에선 밀접한 관계를 갖는다. 그러나 셋은 다른 언어고 서로를 컨트롤하기 위해선 필요한 것 중 하나가 'DOM'이다. 'DOM'은 웹페이지에서 문서의 구성과 내용을 맡은 'HTML' 요소들을 다루기 위해 만들어졌다. 자바스크립트는 'HTML' 문서를 다뤄야하는데 이때 'HTML' 문..