Programming Step/HTML3 DOM Document object model ⇒ HTML 을 파싱하여 사용 가능한 model Create const tweet= document.createElement('div') Append document.body.append(tweet) QuerySelector // 한개만 const oneTweet = document.querySelector('.tweet') // 여러개 const tweets = document.querySelectorAll('.tweet') // 밑에 두개는 같음 (#이 붙지 않음) const getOneTweet = document.getElementById('container') const queryOneTweet = document.querySelector('#contain.. 2022. 8. 23. element 와 node 의 차이 DOM TREE는 Node들로 구성된다. Node는 Element의 상위 개념이다. Element는 node의 특정 타입 즉, Node.ELEMENT_NODE 이다. element는 HTML에서 태그로 적은 노드들을 지칭한다. , , 과 같이 태그로 표현한 것들은 전부 element이다 주석이나 text node와 같은 것들은 HTML 태그로 표현된 것이 아니므로 element가 아니다. DOM에서Node는 node의 constructor이고, HTMLElement는 element의 constructor이다. HTML 태그들로 나타내면 Node이자 element 주석, text처럼 태그가 없다면 Node 아래는 관련 예시이다. let div = document.createElement("div") div.. 2022. 8. 23. 브라우저 기초 지식 [2021-03-18] 브라우저 기초 지식 추가 공부해야할 것react를 렌더링 부분을 보고 있으니 브라우저 기초지식이 부족하다고 느꼈습니다. 각 브라우저의 구조와 브라우저 렌더링 엔진이 어떻게 작동하는지, 각 브라우저의 호환성에 관해 설명하였습니다. 1. 브라우저 기본 구조 사용자 인터페이스 : 요청한 페이지를 보여주는 창을 제외한 나머지 모든 부분 브라우저 엔진 : 사용자 인터페이스와 렌더링 엔진 사이의 동작을 제어. 렌더링 엔진 : 요청한 콘텐츠를 표시. 예시) HTML과 CSS를 파싱하여 화면에 표시함. 통신 : 네트워크 호출에 사용됨, 플랫폼과 독립적인 인터페이스며 하부에서 실행됨. UI백엔드 : 콤보 박스와 창 같은 기본적인 장치를 그림. OS 사용자 인터페이스 체계를 사용. 플랫폼에서 명시하.. 2021. 6. 20. 이전 1 다음
