1.브라우저에 의해 제공되는 BOM객체들은 계층관계로 이루어진다. 계층의 최상위에 있는 객체는 무엇인가?
①document
②window
③body
④html
window 객체는 브라우저가 제공하는 BOM 객체의 최상위에 존재한다.
2.다음객체들 중 특징이 다른 하나를 골라라.
①document
②navigator
현재 작동중인 브라우저에 대한 다양한 정보를 나타내는 객체이다.
③div
④span
3.다음 지시에 따라 window.open()함수를 작성하라.
3-1.이름이 win인 새 윈도우를 열어 test.html을 출력한다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<body>
<script>
window.open("test.html","win");
</script>
</body>
</html>3-2.현재 윈도우에 구글 웹 페이지를 출력한다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<body>
<script>
window.open("https://www.google.co.kr","_self");
</script>
</body>
</html>3-3.크기가 400*500인 새 윈도우에 네이버 페이지를 출력한다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<body>
<script>
window.open("http://www.naver.com","_blank","width=400,height=500");
</script>
</body>
</html>3-4.스크린의 왼쪽 상단 모서리에 위치하는 새 윈도우를 열고, test.html을 출력한다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<body>
<script>
window.open("test.html","_blank","left=0,top=0,width=400,height=500");
</script>
</body>
</html>
4.window.open()을 이용하여 다음 조건에 맞게 윈도우를 여는 코드를 작성하라.
4-1.스크린의 (100,100) 위치에 500*600 크기의 빈 윈도우를 생성하라.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<body>
<script>
window.open("","_blank","left=100,top=100,width=500,height=600");
</script>
</body>
</html>4-2.이름이 google인 윈도우를 열고 구글 웹 페이지를 출력하라.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<body>
<script>
window.open("https://www.google.co.kr","google");
</script>
</body>
</html>
5.현재 브라우저 윈도우에 네이버 페이지를 로드하는 경우가 아닌 것은?
①window.location.href="http://www.naver.com";
②window.location.assign("http://www.naver.com");
③window.location.reload("http://www.naver.com");
④window.location.replace("http://www.naver.com");
location 객체는 윈도우에 로드된 웹 페이지의 URL 정보를 나타내는 객체로서, 윈도우가 열릴 때 자동 생성된다.
location 객체의 프로퍼티와 메소드
href: URL 전체 문자열
assign(): 새로운 웹 페이지를 로드한다.
reload(): 현재 웹 페이지를 다시 로드한다. 페이지가 수정되었으면 반영된다.
replace(): 현재 웹 페이지의 URL을 히스토리에서 제거하고, 새로운 페이지를 로드한다.
6.다음 중 브라우저에 어떤 플러그인이 설치되었는지 알아내는데 사용되는 객체는?
①navigator
②browser
③window
④location
7.다음 중 현재 윈도우에 출력된 웹 페이지를 다시 로드하는 코드가 아닌 것은?
①window.location.reload();
②location.reload();
③history.go(0);
④window.go(0);
history객체는 사용자가 방문한 웹 페이지의 리스트 즉 히스토리 정보를 담고 있는 객체이다.
8.다음 중 navigator 객체를 통해 알 수 없는 정보는?
①위치 정보
geolocation
②브라우저를 제작한 회사
vendor
③웹 페이지의 주소
④브라우저 이름
appName
9.window의 타이머를 활용하는 다음 코드가 있다. 이 코드를 잘 해석한 것은?
var sum=0;
function f(){
sum++;
if(sum==10) clearInterval(id);
}
var id = setInterval("f()",2);①2초마다 f() 함수가 10번 호출된다.
②2밀리초 후에 f() 함수가 1번 호출된다.
③2밀리초 간격으로 f()함수가 10번 호출된다.
④f()함수가 1초 간격으로 2번 호출된다.
10.문제 9에서 주어진 코드를 setTimeout()/clearTimeout()을 이용하여 다시 작성하라.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<body>
<script>
var sum=0;
function f(){
sum++;
if(sum==10) clearInterval(id);
}
var id = setInterval("f()",2);
</script>
</body>
</html><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<body>
<script>
var id;
var sum=0;
function f(){
document.write(sum+"\n");
sum++;
if(sum==10) clearInterval(id);
else setTimeout("f()",2);
}
</script>
</body>
</html>'HTML+CSS+JavaScript' 카테고리의 다른 글
| [HTML5+CSS3+Javascript 웹프로그래밍]12장 OpenChallenge (0) | 2021.11.21 |
|---|---|
| [HTML5+CSS3+Javascript 웹프로그래밍]11장 연습문제 (0) | 2021.11.21 |
| [HTML5+CSS3+Javascript 웹프로그래밍]8장 연습문제 (0) | 2021.11.21 |
| [HTML5+CSS3+Javascript 웹프로그래밍]8장 OpenChallenge (0) | 2021.11.21 |
| [HTML5+CSS3+Javascript 웹프로그래밍]9장 OpenChallenge (0) | 2021.11.21 |