221109 TIL

👩🏻‍💻 이번 프로젝트 때 사용했던 기본적인 자바스크립트 용어에 대해 정리해 보았다.

 

 

 

🔍 DOM(Document Object Model)

: HTML, XML 문서의 프로그래밍 interface 이다. DOM은 문서의 구조화된 표현을 제공하며 프로그래밍 언어가 DOM 구조에 접근할 수 있는 방법을 제공하여 그들이 문서 구조, 스타일, 내용 등을 변경할 수 있게 돕는다. DOM 은 nodes와 objects로 문서를 표현한다. 이들은 웹 페이지를 스크립트 또는 프로그래밍 언어들에서 사용될 수 있게 연결시켜주는 역할을 담당한다.

 

 

 

🔍  document.querySelector() 

: 제공한 선택자와 일치하는 문서 내 첫 번째 element를 반환. 일치하는 요소가 없으면 null을 반환.

 

 

 

🔍  Document.getElementById() 

: 주어진 문자열과 일치하는 id값을 가진 요소를 찾고, 이를 나타내는 element 객체를 반환합니다. id값은 유일해야한다(중복금지).

 

 

 

 

🔍  Document.getElementsByClassName (복수 형태이다!)

: 주어진 클래스 이름을 모두 가진 모든 자식 요소의 배열과 유사한 개체를 반환.

개체에서 호출되면 document 루트 노드를 포함하여 전체 문서가 검색된다. 지정된 클래스 이름을 가진 요소의 자손인 요소만 반환.

 

 

 

🔍  toggle()

: javascript 자체에서 조작하는 것. 실행 할때마다 class값이 있으면 빼고, 없으면 새로 넣는다.

 => ul태그에 class="mystyle"이 추가된것을 확인할 수 있다!

 

 

🔍 Array.prototype.forEach()

: 각 배열 요소에 대해 제공된 함수를 한번 실행함.

=> 요소를 하나씩 뽑아준다.