2023_09_22 JavaScript 공부정리

개발공부/JavaScript 2023. 9. 22. 23:32

노마드코더 바닐라JS크롬앱 3.0강

[노마드코더] 2강~3.6강

-HTML document는 객체이며 js로 변경가능하다.

-console.dir(변수) 를 하면 가져온 태그를 좀더 자세히 알 수 있음.

-getElementsByClassName과 getElementsByTagName는 결과값을 배열로 가져옴

-querySelector()는 CSS 방식으로 태그를 선택할 수 있음(ex querySelector(".hello h1")

-중복되는 태그들을 querySelector()로 지정하면 맨 첫번째것만 출력함

-querySelectorAll()은 결과값을 배열로 가져옴

-addEventListener(이벤트, 이벤트 발생시 실행할 함수)

function handleTitleClick() {

title.style.color = "black";

}

title.addEventListener("mouseover", handleTitleClick); //함수에 ()넣으면 안됨. ()넣으면 바로실행됨.

-event발생에 의한 실행은 다음과 같은 2가지 형식으로 사용가능하다.

title.onmouseenter = handleTitleMouseOver;

title.addEventListener("mouseleave", handleTitleMouseLeave);

-document객체뿐 아니라 window객체도 존재. 다양한 이벤트들이 존재함

window.addEventListener("resize", handleWindowResize); //브라우저 크기조절

window.addEventListener("copy", handleWindowCopy); //복사

window.addEventListener("offline", handleWindowOffline); //와이파이 끊김

-js ==와 ===차이 : ===는 타입까지 일치해야 true. ==는 타입변환을 시켜줌.

코딩일기장 코딩일기장