JavaScript setTimeout() 기본 사용 방법

2599 단어 JavaScriptsetTimeout
웹 페이지의 동적 효과를 제작할 때 실행 지연이 필요한 수요를 만날 수 있습니다. 이때 js의 타이머로 이러한 수요를 실현할 수 있습니다. 본고는 setTimeout()에 대해 용법 총결을 하고자 합니다.
  • setTimeout () 메서드는 지정된 밀리초 뒤에 함수나 계산 표현식(밀리초 단위)을 호출하는 데 사용됩니다
  • setTimeout () 은 함수를 한 번만 실행하고 여러 번 호출해야 할 경우 setInterval () 을 사용하거나 함수 내에서 setTimeout () 을 다시 호출합니다.
    • setTimeout () 사용 방법
    간단한 예를 들다
    다음 코드를 추가하여 열린 페이지에서 3초 동안 기다린 후 경고 상자'안녕하세요'를 팝업합니다
    
<script>
  setTimeout("alert(' ')", 3000) 
</script>
    효과:
    좀 더 복잡한function 정의
    
<script>
var myvar;

function myFunction() {
  myVar = setTimeout(alertFunc, 3000);
}

function alertFunc() {
 alert("Hello!");
}
    자동 초당 1 추가function
    set Timeout () 를 사용하여 텍스트 상자의 수치를 초당 1씩 증가시킵니다. 물론 5초마다 5를 추가하거나 5초마다 1을 추가하는 다른 속도를 설정할 수 있습니다.
    
<script>
x = 0
function countSecond( )
{　x = x+1
　 document.fm.displayBox.value=x
　 setTimeout("countSecond()", 1000)
}
</script> 
<body bgcolor=lightcyan text=red> <p> </br>
<form name=fm>
<input type="text" name="displayBox"value="0" size=4 >
</form>
<script>
countSecond( )
</script>
</body>
    상기 방법으로 시간을 설정하면 set Timeout () 은 1초로 설정되었지만 브라우저는 다른 두 가지 기능을 실행해야 하기 때문에 한 순환의 시간은 1초보다 약간 많다. 예를 들어 1분은 58개의 순환만 있을 수 있다.
    웹 페이지 종료 시간 지연
    버튼을 누르면 Windows open () 에서 웹 페이지를 열고 명령을 실행하면 3초 후에 자동으로 닫힙니다.
    
<button onclick="openWin()">  " "</button>
<script>
function openWin() {
  var myWindow = window.open("", "", "width=200, height=100");
  myWindow.document.write(" ");
  setTimeout(function(){ myWindow.close() }, 3000);
}
</script>
    setTimeout 취소()
    set Timeout () 이 순환 작업을 시작하면, clear Timeout () 을 사용하여 멈추도록 합니다.
    
<button onclick="myFunction()"> </button>
<button onclick="myStopFunction()"> </button>
<script>
var myVar;
function myFunction() {
  myVar = setTimeout(function(){ alert("Hello") }, 2000);
}
function myStopFunction() {
  clearTimeout(myVar);
}
</script>
    작은 매듭
    setTimeout (), clearTimeout (), setInterval () 은 코드를 작성하는 과정에서 그 특징을 유연하게 활용하여 완성해야 할 목적을 달성할 수 있다
    이상은 본문의 전체 내용입니다. 여러분의 학습에 도움이 되고 저희를 많이 응원해 주십시오.
    Swift 기본문법2 (변수/상수 선언, 데이터 타입, any, anyObject, nil)
    프로그래머스(Java)- 다트 게임

    좋은 웹페이지 즐겨찾기

    개발자 우수 사이트 수집

    개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
    best100-homepage