본문 바로가기

Web/Java Script

자바 스크립트 기본 실습 : 브라우저 객체[window, navigator, screen, history, location, document]

1. window

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>자바 스크립트 : 브라우저객체 [window]</title>

<script type="text/javascript">

       

        document.write(window.screenX + "<br />");

        document.write(window.screenY + "<br />");

       

        //1 : 창에 들어갈 페이지명

        //2 : 창의 객체명 (이름)

        //3 : 옵션

        window.open("http://www.naver.com", "win1", "width=500, height=500, left=500, top=200 ");

       

       

</script>

</head>

<body>

 

</body>

</html>

 

 

출력물

 

 

 

 

 

 


 

2. navigator, screen

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>자바 스크립트 : 브라우저객체 [navigator, screen]</title>

</head>

<body>

<script type="text/javascript">

        //navigator

        document.write(navigator.appCodeName + "<br />");

        document.write(navigator.appName + "<br />");

        document.write(navigator.appVersion + "<br />");

        document.write(navigator.cookieEnabled + "<br />");

        document.write(navigator.platform + "<br />");

        document.write(navigator.userAgent + "<br />");

        document.write(navigator.systemLanguages + "<br />");

       

        //screen

        document.write("availHeight : " + screen.availHeight + "<br />");

        document.write("availWidth : " + screen.availWidth + "<br />");

        document.write("height : " + screen.height + "<br />");

        document.write("width : " + screen.width + "<br />");

        document.write("colorDepth : " + screen.colorDepth + "<br />");

       

       

        //화면 '정중앙' window 띄우기

        var left_center = screen.availWidth/2-250;

        var top_center = screen.availHeight/2-300;

        window.open("http://www.google.com", "win1", "width=500, height=500, left=" + left_center + ", top= " + top_center);

 

</script>

</body>

</html>

 

 

 

출력물

 

 

 

 

 


 

3. history

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>자바 스크립트 : 브라우저객체 [history]</title>

</head>

<body>

<!-- 첫번째 페이지 -->

<a href="ex08_02.html">다음 페이지</a>

 

</body>

</html>

 

 

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>자바 스크립트 : 브라우저객체 [history]</title>

</head>

<body>

<!-- 두번째 페이지 -->

<script type="text/javascript">

        history.back();

</script>

 

</body>

</html>

 

 

 

 

 

 


4. location

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>자바 스크립트 : 브라우저객체 [location]</title>

</head>

<body>

<script type="text/javascript">

        /* document.write(location.host + "<br/>");

        document.write(location.hostname + "<br/>");

        document.write(location.port + "<br/>");

        document.write(location.pathname + "<br/>"); */

       

        // 자신의 url 바꿔줌.

        location.href = "http://www.google.co.kr";

       

</script>

 

</body>

</html>

 

 

 

 

 

 

 


 

5. document

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>자바 스크립트 : 브라우저객체 [document]</title>

</head>

<body>

<script type="text/javascript">

        //document.bgColor = "green";

       

        document.write(document.lastModified + "<br />");

        document.write(document.title + "<br />");

       

        document.title = "새로운 문서";        //출력하기 전에 써줘야지 원하는 값을 출력할 있음

</script>

 

</body>

</html>

 

 

 

출력물