본문 바로가기

자바스크립트 요소3

[자바스크립트 기초 ]이벤트의 종류와 개념 1 자바스크립트 이벤트 종류 UI 이벤트 – 사용자가 웹페이지가 아닌 브라우저의 UI와 상호작용할 때 발생이벤트설명load웹 페이지의 로드가 완료되었을 때unload웹 페이지가 언로드 될 때(새로운 페이지를 요청한 경우 )error브라우저가 자바스크립트 오류를 만났거나 요청한 자원이 없는 경우resize브라우저의 창 크기를 조정했을 때scroll사용자가 페이지를 위아래로 스크롤 할 때 키보드 이벤트 – 사용자가 키보드를 이용할 때 발생한다.이벤트설명keydown사용자가 키를 처음 눌렀을 때 keyup키를 땔 때 keypress사용자가 눌렀던 키의 문자가 입력되었을 때 마우스 이벤트 – 사용자가 마우스나 터치화면을 사용할 때 발생이벤트설명click사용자가 동일한 요소 위에서 마우스 버튼을 눌렀다 땔 때dbcl.. 2017. 2. 26.
[자바스크립트 기초]DOM 문서객체모델의 이해 2 DOM탐색하기 페이지에 요소 노드가 존재한다면 다음 5가지 속성을 이용하여 다른 요소들을 선택할 수 있다. 이런 과정을 DOM 탐색이라고 한다. parentNode – 이 속성은 부모 노드를 찾는다.previousSibling – 이전 노드를 찾는다.nextSibling - 다음 노드를 찾는다firstChild - 첫 번째 자식 요소를 찾는다.lastChild – 마지막 자식 요소를 찾는다. (요소가 존재 하지 않을 때는 null 이 리턴된다.)(IE를 제외한 대부분의 브라우저들은 요소 사이의 공백 문자를 텍스트로 취급하기 때문에 리턴하는 값은 브라우저에 따라 달라지게 된다.) 이전&다음 이웃 요소.HTML List Buy groceries fresh figspine nutshoneybalsamic vi.. 2017. 2. 25.
[자바스크립트 기초]DOM 문서객체모델의 이해1 문서 객체 모델은 브라우저가 HTML 페이지의 모델을 생성하고 이 페이지가 브라우저 창에 보여지는 동안 자바스크립트를 이용하여 웹페이지의 내용에 접근하고 수정하기 위한 방법을 명시하고 있다. HTML 페이지에 대한 모델 구성하기브라우저는 웹 페이지를 로드한 후 , 이 페이지에 대한 모델을 메모리에 생성한다. HTML 페이지에 접근하고 수정하기DOM은 모델 내의 각 객체에 접근하고 내용을 수정하기 위한 속성과 메서드들을 정의하고 있다. 내용을 수정하면 브라우저에서 사용자가 보게 될 내용이 변경된다. DOM은 브라우저가 DOM트리를 이용하여 이 모델을 구성하는 방법을 명시한다.DOM이 객체 모델이라고 불리는 이유는 모델이 객체를 이용하여 구성되기 때문이다. 웹 페이지에 대한 모델로서의 DOM 트리브라우저는 .. 2017. 2. 24.