Js복습 pt.1 DOM과 BOM

리액트 중단 선언 ＼(´◓Д◔`)／한지 이주일 물론 말이 선언이지 Slider랑 slick에 대해서 검색하는데,

새끼손톱 하나 삐져나온 걸 보면 손톱 전부 깍듯이 내가 모자란 부분 + 보충하고 넘어가고 싶은 부분이 여러 개 보였다.

cd플레이어사서 cd한달에 한번씩 사려하는데  백예린 우사위앨범 20만원이네?

 

리액트를 배우다 보니 내가 자바스크립트를 무지한 상태로 넘어온 게 아닌가 싶다.

 

프론트엔드에 있어 필요한 내용이 담긴 강의 정리 + 새로 산 책인 도마뱀 자바스크립트를 차차 리뷰해보려 한다. 

 

언제까지 작성하고 언제 또 중단하고 리액트로 넘어갈지는 모르겠다.

 

그리고 css도 좀 제대로 정리하고 배우고 넘어가려 한다. 이것도 언제 바뀔지 모름 ヘ（。□°）ヘ

 

난 오고가고 할 때를 도무지 모르겠다. 아저씨 낭만 합격.

---

 

내가 계속 배우고 있는 자바스크립트는 html을 조작하기 위해 만들어진 언어이다.

이렇게 조작한 html은 브라우저에 표현이 되는데, 각 브라우저에는 웹문서를 해석 가능한 렌더링 엔진들이 있다.

 

크롬(블링크),  파이어폭스(게코), 사파리(웹킷) 사파리(웹킷)... 등

렌더링 엔진은 문서를 객체화한다. 그리고 이걸 문서 객체모델 Document Objet Model DOM이라고 한다.

 

1. Dom

Dom은 트리구조를 가진다. 나뭇가지가 곳곳으로 뻗쳐진 나무처럼 html태그 안에 head, body태그가 또 태그 안에 태그가 있듯이,

부모와 n개의 자식 태그를 가진다.  이러한 구조를 dom tree라 하고 각각의 요소를 노드라고 한다.

 

사진을 보면 잘 이해가 될 것이다.

브라우저 자체를 제어하기 위해 만든걸 bom browser object model css는 com이라고 부른다.
document는 웹페이지 자체이자 웹트리의 최상위 노드이다.

 

 

2. Bom

방금 위의 Dom이 문서 객체 모델이었다면 Bom의 경우 웹브라우저를 객체화한 것이다. (브라우저를 Script언어로 제어하기 위해)

브라우저 객체에는 어떤 것들이 있는지 보도록 하자.

• WINDOW - 모든 객체가 소속된 창 생략이 가능하다.
• DOCUMENT - 현재 문서에 대한 정보를 갖고 있는 객체(DOM에 대한 정보를 가지고 있음)
• HISTORY - 현재 브라우저가 방문했던 URL히스토리를 제어함 (뒤로 가기, 앞으로 가기)
• LOCATION - 문서의 주소와 관련된 객체 WINDOW객체의 #프로퍼티이자 DOCUMENT의 프로퍼티이다. (웹문서 URL 변경,  문서의 위치 관련 정보 획득 가능)
• SCREEN - 사용자의 디스플레이 화면에 대하여 다양한 정보를 가짐(길이, 너비 등)
• NAVIGATOR - 실행 중인 애플리케이션에 대한 정보를 알 수 있음(위치정보, 브라우저 버전 등)

 

# 프로퍼티  -> 이름과 값을 가진 객체의 특징