본문 바로가기

JS-DOM

(4)
04. 부모-자식 창, alert, timing, JSON 1. 부모-자식 창 새 창을 열면 새 창은 “자식” 기존 창은 “부모” 가 된다. 자식 입장에서 부모 창은 opener 라고 명명 한다. 부모와 자식 사이에 데이터를 전달 할 수 있다. 창열기 창닫기 자식 창에서 받은 값 : 자식 창으로 보낼 값 : 보내기 부모 창에서 받은 값 : 부모 창으로 보낼 값 : 보내기 2. alert Browser 에서는 새 창 이외에도 “경고 창” 을 제공 한다. 경고 창은 새 창과 달리 tool bar 가 존재하지 않으며 기능이 한정되어 있다. alert() confirm() prompt() 3. timing Browser 에서는 특정 시간마다 어떤 일을 수행 할 수 있습니다. 특정 시간 후에 어떤 일을 수행 할 수도 있습니다. 그 시간의 단위는 1/1000 초(milli..
03. Window Object 1. Window Object Window 는 브라우저 “창” 을 의미 한다. window 객체를 이용해 새로운 “window” 를 “open” 할 수도 “close” 할 수도 있다. open() open 함수는 새로운 윈도우 창을 생성 해 준다. 총 3개의 인자값을 갖는다. window.open(보여줄 페이지 주소,"창 이름","옵션"); close() 열었던 새 창을 닫는 역할을 수행하는 함수 basic 창닫기 2. location 객체 location 객체는 창을 이동시키거나 이동 주소에 대한 정보를 제공해 준다. window.location 이 정식 명칭이지만, window 는 생략할 수 있다. attribute Description window.location.href 현재 페이지가 존재하는 전..
02. Event 1. Event Event 는 어떤 “사건” 을 의미 한다. 아래는 가장 일반적으로 사용하는 이벤트 속성이다. Event Description onchange Html 문서가 변경이 있을 경우 작동(예: select 변경 등) onclick 클릭시 onmouseover 마우스가 위로 올라왔을 경우 onmouseout 마우스가 특정 영역을 벗어 났을 경우 onkeydown 키가 눌렸을 경우 onload 브라우저가 모든 페이지를 로딩 한 후 오늘의 날짜 : Audi BMW Benz Volvo 2. Event 객체와 this 이벤트가 발생할 경우 이벤트 객체 가 반환 된다. 그리고 이벤트가 발생한 당사자 요소인 this 도 있다. 이 두 객체를 활용하면 복잡한 내용도 쉽게 해결 할 수 있다. Event Des..
01. JS-DOM의 기초 1. DOM (Document Object Model) Java Script 에서는 문서 내 요소(태그)를 가져와 속성을 다루는 역할을 주로 한다. Method Description document.getElementById( ) 문서 내에서 특정 ID 를 갖는 Element 를 찾는다. document.getElementsByTagName( ) 문서 내에서 특정 Tag를 갖는 Element 들을 찾는다. document.getElementsByClassName( ) 문서 내에서 특정 Class를 갖는 Element 들을 찾는다. document.querySelector( ) CSS 의 Selector 같은 역할 을 한다.(IE8 이하는 사용 못 함) document.querySelectorAll( ) ..