본문 바로가기

전체 글14

DOM 웹 페이지가 만들어지는 방법 먼저 DOM을 이해하기 위해서는 웹 페이지의 빌드과정을 알아야 한다. Critical Rendering Path 브라우저가 서버에서 페이지에 대한 HTML 응답을 받으면 화면에 표시되기 전에 많은 단계를 거쳐야 하는데 웹 브라우저가 원본 HTML 문서를 읽어들인 후, 스타일을 입히고 대화형 페이지로 만들어 뷰 포트에 표시하기까지의 과정을 Critical Rendering Path, CPR이라고 한다. CRP의 6단계 과정 DOM 트리 구축 CSSSOM 트리 구축 JavaScript 실행 렌더 트리 구축 레이아웃 생성 페인팅 위와 같이 CRP 과정은 6단계로 나누어져 있지만 대략 렌더 트리 구축을 기점으로 두 단계로 나눌 수 있다. 첫번째 단계 : 브라우저는 읽어들인 문서를 파.. 2021. 12. 30.
jQuery jQuery란 무엇인가? jQuery란 JavaScript의 생산성을 향상시켜주는 JavaScript 라이브러리이다. 라이브러리란? 자주 사용하는 코드들을 재사용할 수 있는 형태로 가공해서 프로그래밍 효율을 높여주는 코드들이다. jQuery의 특징 Element를 선택하기 쉽게 할 수 있다. 선택된 Element들을 효율적으로 제어할 수 있다. JavaScript로 만들어진 라이브러리이다. jQuery 사용방법 jQuery를 사용하는 방법에는 아래와 같이 2가지가 있다. 직접 서비스 하는 방법 jQuery 사이트에서 jQuery 파일을 다운받고 자신의 웹 서버나 온라인 상에 존재하는 공간에 업로드 한 후 script src의 속성값으로 전달한다. 구글의 자바스크립트 라이브러리를 사용하는 경우 url을 복.. 2021. 12. 30.
JSON JSON (JavaScript Object Notation) JavaScript Object Notation라는 의미의 축약어로 데이터를 저장하거나 전송할 때 많이 사용되는 경량의 DATA 교환 형식 Javascript에서 객체를 만들 때 사용하는 표현식을 의미한다. JSON 표현식은 사람과 기계 모두 이해하기 쉬우며 용량이 작아서, 최근에는 JSON이 XML을 대체해서 데이터 전송 등에 많이 사용한다. JSON은 데이터 포맷일 뿐이며 어떠한 통신 방법도, 프로그래밍 문법도 아닌 단순히 데이터를 표시하는 표현 방법일 뿐이다. JSON 특징 서버와 클라이언트 간의 교류에서 일반적으로 많이 사용된다. 자바스크립트 객체 표기법과 아주 유사하다. 자바스크립트를 이용하여 JSON 형식의 문서를 쉽게 자바스크립트 .. 2021. 12. 30.
AJAX * 이 게시물의 대표이미지는 유럽축구클럽 AFC Ajax의 앰블럼이니 착오 없으시기 바랍니다. AJAX (Asynchronous Javascript And XML) 정의 Asynchronous Javascript And Xml(비동기식 자바스크립트와 xml)의 약자 자바스크립트를 이용해 서버와 브라우저가 비동기 방식으로 데이터를 교환할 수 있는 통신 기능 브라우저가 가지고있는 XMLHttpRequest 객체를 이용해서 전체 페이지를 새로 고치지 않고도 페이지의 일부만을 위한 데이터를 로드하는 기법 즉, 쉽게 말하자면 자바스크립트를 통해서 서버에 데이터를 비동기 방식으로 요청하는 것이다. 비동기 방식이란? 비동기 방식은 웹페이지를 리로드하지 않고 데이터를 불러오는 방식이며 Ajax를 통해서 서버에 요청을 .. 2021. 12. 30.