Web Api 객체
- BOM(Browser Object Model): 비표준
window 객체
- 웹 브라우저의 창이나 탭을 표현하기 위한 객체들이며 웹 브라우저는 window 객체를 이용하여 브라우저 창을 표현할 수 있음
- window.alert()
- window.confirm()
- window.prompt()
window 객체의 메소드
setTimeOut()
- 일정 시간이 지난 후 매개변수로 제공된 함수를 실행
const 함수명 = function(){
실행문;
...
}
const st = setTimeOut(함수명, 밀리초)
clearTimeout()
- 일정 시간후에 일어날 setTimeOut()를 취소함
// setTimeOut()
const 함수명 = function(){
실행문;
...
}
const st = setTimeOut(함수명, 밀리초)
//clearTimeout()
clearTimeout(st);
setTimeOut()
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>setTimeOut</title>
</head>
<body>
<h2>setTimeOut</h2>
<script>
const hello = function() {
alert("안녕하세요. JavaScript!");
}
const st = setTimeout(hello, 5000); // 5초
</script>
</body>
</html>
5초 뒤에 함수 실행
clearTimeout() 예제
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>setTimeOut</title>
</head>
<body>
<h2>setTimeOut</h2>
<button onclick="clearTimeout()">중지</button>
<script>
const hello = function() {
alert("안녕하세요. JavaScript!");
}
const st = setTimeout(hello, 5000); // 5초
clearTimeout(st);
</script>
</body>
</html>
clearTimeout()으로 인해 함수가 실행되지 않음
setInterval()
const 함수명 = function(){
실행문;
...
}
const st = setInterval(함수명, 밀리초);
clearInterval()
- 일정 시간마다 일어날 setInterval()를 취소함
// setInterval()
const 함수명 = function(){
실행문;
...
}
const st = setInterval(함수명, 밀리초);
// clearInterval
clearInterval(st)
setInterval(), clearInterval() 예제
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>setInterval</title>
</head>
<body>
<h2>setInterval</h2>
<script>
const hello = function() {
console.log("안녕하세요. JavaScript!");
}
const si = setInterval(hello, 3000);
const clearInter = function(){
clearInterval(si);
console.log("hello()가 중지되었음!");
}
</script>
<p><button onclick="clearInter()">중지</button></p>
</body>
</html>
3초에 한번씩 "안녕하세요. JavaScript!"를출력함
중지 버튼을 누르면 더 이상 출력하지 않음