본문 바로가기

전체 글160

보간법 element-${} 위와 같이 달러 표시와 중괄호를 사용하는 것을 보간법이라 한다. 보간법을 사용하기 위해서는 backtick 기호(`)를 사용해야 한다. `element-${}` div element 1 div element 2 div element 3 div element 4 div element 5 const divElems = document.querySelectorAll('.div'); divElems.forEach(function(item, index) { console.log(`item index: ${index}`); }); 2022. 11. 29.
defer div element const divElem = document.querySelector('.div'); console.log('querySelector result: ', divElem); 위와 같이 작성할 경우, 다음과 같이 null값이 반환된다. 웹 브라우저는 HTML의 맨 위에서부터 아래로 순차적으로 문서를 읽어나간다. 이 때, script 요소를 읽은 시점은 body 요소를 읽기 전인데, 스크립트문에 의해 알 수 없는 요소에 대한 querySelector를 실행하고 있는 셈이 된다. 따라서 null이 반환된다. 이를 해결하기 위해선 script 요소에 defer 속성을 추가해주어야 한다. div element defer는 HTML 문서를 모두 읽은 후에 script 파일을 읽도록 지시한다. 2022. 11. 29.
DOM(Document Object Model) DOM은 웹 문서 제어를 위한 프로그래밍 인터페이스다. 웹 상의 문서 내용과 문서의 구조를 구성하는 항목들(div, span, input 등)은 모두 object들이다. DOM은 이를 메모리에 계층으로 표현하며(그림 1) 이들을 제어(생성, 변형, 삭제 등)할 수 있도록 돕는 프로그래밍 인터페이스다. 이를 위해 API가 제공되며, 이들 API들은 브라우저에 이미 저장된 기능들이다. 따라서 DOM을 이용하면 웹 문서의 구조나 스타일, 내용을 바꿀 수 있다. DOM 자체는 프로그래밍 언어가 아니기 때문에 DOM을 이용하기 위해서는 주로 javascript와 같은 스크립트 언어를 이용한다. DOM API에는 기본적으로 다음의 것들이 있다. querySelector querySelectorAll addEvent.. 2022. 11. 29.
[윈도우] 윈도우 성능 최적화 색인 끄기 검색 → services.msc → windows search → 중지 레지스트리 정리 윈도우+R → regedit → 파일 → 내보내기 → auslogics registry cleaner → scan now → resolve 애니메이션 효과 제거 sysdm.cpl → 고급 → 성능 → 설정 → 최적 성능으로 조정 검색 → 색 설정 → 투명 효과 → 끔 백그라운드 앱 해제 "백그라운드 앱" 검색 후 해제 CPU 업데이트 사용하는 CPU 제조사의 업데이트가 있는지 살핀다. intel cpu update 구글링 → 인텔 사이트에서 업데이트 항목 있으면 업데이트 진행 Reference https://dora-guide.com/windows-10-optimization/ 2020. 8. 23.