DOM & EVENT - 유튜브 코딩앙마
1.DOM&EVENT, 노드에 접근하기 _ 코딩앙마
유튜브 코딩앙마 영상을 보고 정리한 내용입니다.DOM 은 Document Object Model 의 약자입니다. html 문서의 각 요소들을 tree 형식으로 표현해주는 데 이를 DOM TREE 라고 합니다.트리구조에서 하나의 개체를 노드라고 부릅니다. 트리에서 위쪽은
2.DOM&EVENT, 부조, 자식, 형제 노드 _ 코딩앙마
유튜브 코딩앙마 영상을 보고 정리한 내용입니다.아래와 같은 방법으로 부모노드에게 접근할 수 있습니다. 노드의 타입 12개 정도 되는데 주로 사용하는 타입은 아래와 같습니다. 자식요소는 아래처럼 확인할 수 있습니다. 형재 노드는 이전과 이후로 선택할 수 있습니다. 실무에
3.DOM&EVENT, 노드 생성, 추가, 복제, 삭제 _ 코딩앙마
유튜브 코딩앙마 영상을 보고 정리한 내용입니다.아래와 같은 li 태그가 있을 때 firstChild firstElementChild 로 해당 노드 및 해당 노드의 요소를 반환 할 수 있습니다.nodeName nodeType nodeValue 를 사용하면 해당 노드의 값
4.DOM&EVENT, CSS style, class 제어 _ 코딩앙마
유튜브 코딩앙마 영상을 보고 정리한 내용입니다.DOM 으로 html 요소에 스타일을 적용할 수 있습니다.해당 태그에 css 속성을 담은 클래스 이름을 붙여주는 방식을 자주 사용합니다.className 은 기존 클래스 명을 리셋하므로 잘 사용하지 않습니다. 실제로 자주
5.DOM&EVENT, 이벤트 핸들러(Event Handler) _ 코딩앙마
유튜브 코딩앙마 영상을 보고 정리한 내용입니다.마우스를 클릭하거나 키보드를 입력하면 이벤트가 발생합니다. 이때 특정 함수를 할당해서 실행할 수 있는데, 이것을 핸들러라고 합니다. 문서 로드가 완료되었을 때 이벤트 DOMcontentLoaded 는 아래 처럼 작성해야 동
6.DOM&EVENT, CSS style, class 제어 _ 코딩앙마
유튜브 코딩앙마 영상을 보고 정리한 내용입니다.이벤트가 어떻게 전파되는지 알아봅니다.이런 구조일 때 모든 요소를 클릭할 때 콘솔로그가 찍히게 한다면,자식요소를 클릭하면 부모요소들도 순차적으로 클릭됩니다. 하위 요소에서 상위 요소로 올라가는데, 이것을 이벤트 버블링(bu