### 창만들기

<!DOCTYPE html>
<html>
<style>li {padding:10px; list-style: none}</style>
<body>
<ul>
    <li>
        첫번째 인자는 새 창에 로드할 문서의 URL이다. 인자를 생략하면 이름이 붙지 않은 새 창이 만들어진다.<br />
        <input type="button" onclick="open1()" value="window.open('demo2.html');" />
    </li>
    <li>
        두번째 인자는 새 창의 이름이다. _self는 스크립트가 실행되는 창을 의미한다.<br />
        <input type="button" onclick="open2()" value="window.open('demo2.html', '_self');" />
    </li>
    <li>
        _blank는 새 창을 의미한다. <br />
        <input type="button" onclick="open3()" value="window.open('demo2.html', '_blank');" />
    </li>
    <li>
        창에 이름을 붙일 수 있다. open을 재실행 했을 때 동일한 이름의 창이 있다면 그곳으로 문서가 로드된다.<br />
        <input type="button" onclick="open4()" value="window.open('demo2.html', 'ot');" />
    </li>
    <li>
        세번재 인자는 새 창의 모양과 관련된 속성이 온다.<br />
        <input type="button" onclick="open5()" value="window.open('demo2.html', '_blank', 'width=200, height=200, resizable=yes');" />
    </li>
</ul>
 
<script>
function open1(){
    window.open('demo2.html');  
    //새창이 만들어진다
}
function open2(){
    window.open('demo2.html', '_self'); 
    //자기자신 창이 변환된다
}
function open3(){
    window.open('demo2.html', '_blank');
    //새창이 만들어진다
}
function open4(){
    window.open('demo2.html', 'ot');
    // 이름이 'ot' 라는 새창이 1개만 만들어진다 이미있으면 변환된다
}
function open5(){
    window.open('demo2.html', '_blank', 'width=200, height=200, resizable=no');
    // 새창을  만들며 크기를 조정하였다 그다음 창크기를 변경불가능하게 함니다
}
</script>
</body>
</html>

 

 


### 외부 창의 텍스트 원격 설정하기

<!DOCTYPE html>
<html>
<body>
    <input type="button" value="open" onclick="winopen();" />
    <input type="text" onkeypress="winmessage(this.value)" />
    <input type="button" value="close" onclick="winclose()" />
    <script>
    function winopen(){
        win = window.open('demo2.html', 'ot', 'width=300px, height=500px');
    }
    function winmessage(msg){
        win.document.getElementById('message').innerText=msg;
    }
    function winclose(){
        win.close();
    }
    </script>
</body>
</html>

 

### 시작시 팝업 하기 

<!DOCTYPE html>
<html>
<body>
    <script>
    window.open('demo2.html');
    </script>
</body>
</html>

'HTML 참고서 > HTML 생활코딩 Youtube' 카테고리의 다른 글

9. JavaScript jQuery  (0) 2020.04.12
8. JavaScript 제어대상 찾기  (0) 2020.04.12
6. JavaScript Navigator  (0) 2020.04.12
5.JavaScript Location  (0) 2020.04.12
4.Javascript 객체  (0) 2020.04.10
블로그 이미지

Or71nH

,