푸으름

✏️ DOM에 접근 - getElementById() 메서드document.getElementById("heading")// getElementById() 메서드를 사용하면 특정한 id가 포함된 DOM 요소에 접근할 수 있습니다.// 기본형 => 요소명.getElementById("id명") ✏️ DOM에 접근 - getElementsByClassName() 메서드document.getElementByClassName("bright")// getElementsByClassName() 메서드는 지정한 class 선택자 이름이 들어 있는 DOM 요소에 접근할 수 있습니다. class 선택자는 웹 문서 안의 여러 요소에서 사용할 수 있으므로 getElementsByClassName() 메서드를 사용하면 반환 ..

✏️ 문서 객체 모델(DOM)자바스크립트를 이용하여 웹 문서에 접근하고 제어할 수 있도록 객체를 사용해 웹 문서를 체계적으로 정리하는 방법을 말합니다. HTML 언어로 작성한 웹 문서의 DOM을 HTML DOM이라고 하며, XML 문서에서 사용하는 XML DOM도 있습니다. DOM은 웹 문서를 하나의 객체로 정희하고 웹 문서를 이루는 텍스트나 이미지, 표 등의 모든 요소도 객체로 정의합니다.웹 문서 자체는 document 객체이고 삽입한 이미지는 image 객체입니다. ✏️ DOM 트리자바스크립트로 DOM을 조작하기 위해서는 DOM으로 어떻게 표현되는지를 알아야 합니다. DOM은 웹 문서의 요소들을 부모 요소와 자식 요소로 구분합니다. 마치 트리처럼 말이죠. Do it! // 위의 코드들을 CSS에서..

✏️ 이벤트 알아보기https://pooreumjung.tistory.com/421 [Web/JS] 자바스크립트 - 이벤트와 이벤트 처리기✏️ 이벤트웹 브라우저나 사용자가 행하는 어떤 동작을 말합니다. 예를 들어서 키보드에서 키를 누르는 것, 웹 브라우저에서 새로운 페이지를 불러오는 것 등이 이벤트입니다. 하지만 웹 브라pooreumjung.tistory.com✏️ DOM위의 게시물에서는 이벤트 처리기를 지정하는 방법은 HTML이 주인이 되어 자바사크립트 함수를 불러와서 사용한다고 언급했었습니다. 하지만 DOM을 사용하게 되면 자바스크립트가 주인이 되어 HTML 요소를 가져와서 이벤트 처리기를 연결합니다. 즉 HTML과 자바스크립트 중 어느 쪽을 중심으로 잡는가에 따라서 지정하는 방법이 달라질 수 있습니..