(BOM)창 제어

창 제어

window.open 메소드는 새 창을 생성한다. 현대의 브라우저는 대부분 탭을 지원하기 때문에 window.open은 새 창을 만든다.

아래는 window.open 메소드에 대한 사용을 알 수 있는 코딩이다.

# open1함수는 기본적인 window.open() 메서드이다. demo2.html의 새 창을 열어 준다.

# open2, open3, open4함수를 보면 두번째 인자로 demo2.html을 어떠한 방식으로 창을 열것인가에대한 내용이다. _self는 현재 페이지에서 demo2.html파일을 열고 _blank는 새 탭에 demo2.html이 열린다. 여기서  open3함수의 버튼을 계속해서 클릭한다면 새 탭에 계속해서 demo2.html 파일이 생겨 날 것이다. 하지만 open4()의 'ot' 인자를 주면 demo2.html이 한번 열어져 있다면 그페이지를 재로드할 뿐이다.

# 마지막 세번째 인자는 style속성을 주는 것이다. 가로세로가 200px의 새 창을 열어 준다.

 

---

 

새 창에 접근

 

 

위의 과정은 다음과 같다.

(1) open 버튼을 클릭했을 때 , winopen()함수가 실행된다. 여기가 중요한데.! 위와 같이 window.open을 했을때 리턴 값으로 open한 html파일의 객체를 돌려준다. 그리고 demo2.html의 결과의 새 창이 열린다.

 

(2) 그다음 input태그를 보면, onkeypress이벤트(키를 누르면) winmessage(this.value)를 실행한다. 여기서 this.value는 text창에 입력한 값을 말한다. winmessage함수를 보면 winopen함수의 리턴 값인 win에 접근하여 id가 message인 태그의 innerText를 인자로 받은 msg로 바꿔주고 있다.  

 

(3) winclose()함수는 간단하다 open을통해 열은 win객체의 웹페이지를 닫아준다.

 

---