본문 바로가기
📖 나의 개발일지 (WIL&TIL)

[TIL] 오늘의 개발일지

by 따따시 2023. 3. 17.

 

 

오늘의 미러전

어제는 이력서 특강을 듣고 이력서를 작성하면서 시간을 보냈고, 오늘은 특강 전까지 여유가 있어 다시 바닐라 자스로 짰었던 나의 코드를 살피면서 자스 공부를 다시 했다.

 

window 객체와 document객체의 차이가 뭐지? 

BOM은 브라우저 객체모델

DOM은 다큐먼트 객체모델(문서 객체모델) , DOM은 표준객체모델이고 BOM은 표준객체모델이 아니래

BOM은 자쓰가 브라우저의 기능적인 요소들을 직접 제어하고 관리할 방법을 제공해준다.

자스에서 BOM모델의 객체들은 전역 객체로 사용할 수 있다고 함

 

 

브라우저 객체 모델(BOM)이란?

BOM은 브라우저 객체모델

DOM은 다큐먼트 객체모델(문서 객체모델) , DOM은 표준객체모델이고 BOM은 표준객체모델이 아니다. 

BOM은 자쓰가 브라우저의 기능적인 요소들을 직접 제어하고 관리할 방법을 제공해주고, 자스에서 BOM모델의 객체들은 전역 객체로 사용할 수 있다. 

 

Window 객체

window 객체는 웹 브라우저의 창(window)을 나타내는 객체로, 대부분의 웹 브라우저에서 지원하고 있다.

자바스크립트의 모든 객체, 전역 함수, 전역 변수들은 자동으로 window 객체의 프로퍼티가 된다

window 객체의 메소드는 전역 함수이며, window 객체의 프로퍼티는 전역 변수가 된다.

문서 객체 모델(DOM)의 요소들도 모두 window 객체의 프로퍼티가 된다.

 

Document 객체

Document 객체는 웹 페이지 그 자체를 의미

웹 페이지에 존재하는 HTML 요소에 접근하고자 할 때는 반드시 Document 객체부터 시작해야 한다.

 

Document 인터페이스는 브라우저가 불러온 웹 페이지를 나타내며, 페이지 콘텐츠(DOM 트리)의 진입점 역할을 수행한다.

DOM 트리는 <body> <table>  여러 다른 요소를 포함한다.

Document는 페이지의 URL을 얻거나 문서에 새로운 요소를 생성하는 등의 기능을 전역적으로 제공한다.

 

HTML 요소 선택 메소드

document.getElementsByTagName(태그이름) 해당 태그 이름의 요소를 모두 선택함.
document.getElementById(아이디) 해당 아이디의 요소를 선택함.
document.getElementsByClassName(클래스이름) 해당 클래스에 속한 요소를 모두 선택함.
document.getElementsByName(name속성값) 해당 name 속성값을 가지는 요소를 모두 선택함.
document.querySelectorAll(선택자) 해당 선택자로 선택되는 요소를 모두 선택함.

 

 

'📖 나의 개발일지 (WIL&TIL)' 카테고리의 다른 글

[TIL] 오늘의 개발일지  (1) 2023.03.19
[TIL] 오늘의 개발일지  (1) 2023.03.18
[TIL] 오늘의 개발일지  (0) 2023.03.16
[TIL] 오늘의 개발일지  (1) 2023.03.15
[TIL] 오늘의 개발일지  (0) 2023.03.13

댓글