DOM2 크롬으로 DOM 디버깅 기본적인 사용법은 공식 문서에서 확인할 수 있다. 이 글에서는 좋은 기능들을 정리해보고자 한다. developer.chrome.com/docs/devtools/dom/ Get Started With Viewing And Changing The DOM - Chrome Developers How to view nodes, search for nodes, edit nodes, reference nodes in the Console, break on node changes, and more. developer.chrome.com # 키보드로 DOM 탐색하기 크롬 디버거로 DOM을 디버깅하다 보면 손이 굉장히 바쁘다. 조금 더 편하게 디버깅하려면 키보드 arrow(화살표)를 활용하면 된다. 다음과 같은 디버거 상.. 2021. 5. 5. HTML DOM 이란?(Document Object Model) 크롤러를 개발하거나, 웹 프론트엔드 자바스크립트 개발 시 document라는 단어가 들어있는 api들을 보았을 것이다. 이때 document에 관련된 글이다. 우리가 작성한 html, css 파일은 결국 각각의 파일로서 저장이 되어있는 상태이다. 그럼 이것을 결합해주는 방식은 어떻게 될까? 바로 파서들에 의해서 파싱 되고 이를 트리 형태를 기반으로 한 DOM이 되는 형식이다. html->파싱 ┐ ㅡㅡ> DOM -> 브라우저에 의해 화면에 표시 css->파싱 ┘ 위와 같이 간략하게 나타내는 것이 우리가 프론트엔드 개발을 한 후 화면에 보이는 절차이다. 우리는 DOM이라는 중간 모델을 거쳐서 화면에 표시되게 된다. 따라서 우리가 동적인 웹을 만들게 되면 javascript를 사용하게 되는데 이때, html .. 2020. 5. 5. 이전 1 다음
