JavaScript 타이밍 이벤트 이해 및 사용

JavaScript 타이밍 이벤트는 웹사이트의 시간 계산에 중요한 역할을 합니다. 이 글을 통해 이에 대한 이해를 높일 수 있습니다.

JavaScript Timing Events

JavaScript를 사용하면 함수 호출 직후가 아닌 설정된 시간 간격 후에 코드를 실행할 수 있습니다. 우리는 이것을 타이밍 이벤트라고 부릅니다.

JavaScript에서 타이밍 이벤트를 사용하는 것은 매우 쉽습니다. 두 가지 주요 메서드는 다음과 같습니다.

setInterval() - 间隔指定的毫秒数不停地执行指定的代码。
setTimeout() - 在指定的毫秒数后执行指定代码。

참고: setInterval() 및 setTimeout()은 HTML DOM Window 개체의 두 가지 메서드입니다.

setInterval() 方法
setInterval() 间隔指定的毫秒数不停地执行指定的代码

구문

window.setInterval("javascript function",milliseconds);
window.setInterval() 方法可以不使用window前缀，直接使用函数setInterval()。
setInterval() 第一个参数是函数（function）。

두 번째 매개변수 간격(밀리초)

참고: 1000밀리초는 1초입니다.

예

3초마다 "hello" 팝업이 표시됩니다.

setInterval(function(){alert("Hello")},3000);
实例展示了如何使用 setInterval() 方法，但是每三秒弹出一次对用户体验并不好。

다음 예는 현재 시간을 표시합니다. setInterval() 메소드는 시계처럼 매초 실행되도록 코드를 설정합니다.

Instance

현재 시간을 표시합니다

var myVar=setInterval(function(){myTimer()},1000); 
function myTimer(){
    var d=new Date();    var t=d.toLocaleTimeString();    document.getElementById("demo").innerHTML=t;}

실행을 중지하는 방법?

clearInterval() 메서드는 setInterval() 메서드 실행의 함수 코드를 중지하는 데 사용됩니다.

Syntax

window.clearInterval(intervalVariable)

window.clearInterval() 메서드는 창 접두어를 사용하지 않고 직접적으로clearInterval() 함수를 사용할 수 있습니다.

clearInterval() 메서드를 사용하려면 타이밍 메서드를 생성할 때 전역 변수를 사용해야 합니다.

myVar=setInterval("javascript function",milliseconds);

그런 다음 ClearInterval() 메서드를 사용하여 실행을 중지할 수 있습니다. .

예제

다음 예에서는 "중지" 버튼을 추가했습니다.

<p id="demo"></p><button onclick="myStopFunction()">停止</button><script>var myVar=setInterval(function(){myTimer()},1000);
function myTimer(){
    var d=new Date();
    var t=d.toLocaleTimeString();
    document.getElementById("demo").innerHTML=t;
}
function myStopFunction(){
    clearInterval(myVar);
}</script>

setTimeout() 메서드

Syntax

myVar= window.setTimeout("javascript function", milliseconds);
setTimeout() 方法会返回某个值。在上面的语句中，值被储存在名为 myVar 的变量中。假如你希望取消这个 setTimeout()，你可以使用这个变量名来指定它。
setTimeout() 的第一个参数是含有 JavaScript 语句的字符串。这个语句可能诸如 "alert('5 seconds!')"，或者对函数的调用，诸如 alertMsg。

두 번째 매개변수는 현재 시간으로부터 첫 번째 매개변수를 실행하는 데 걸리는 시간(밀리초)을 나타냅니다.

팁: 1000밀리초는 1초와 같습니다.

Example

3초간 기다렸다가 "Hello" 팝업이 뜹니다:

setTimeout(function(){alert("Hello")},3000);

실행을 중지하는 방법?

clearTimeout() 메소드는 setTimeout() 메소드의 함수 코드 실행을 중지하는 데 사용됩니다.

Syntax

window.clearTimeout(timeoutVariable)

window.clearTimeout() 메서드는 창 접두어를 사용할 수 없습니다.

clearTimeout() 메서드를 사용하려면 생성 시간 초과 메서드(setTimeout)에서 전역 변수를 사용해야 합니다.

myVar=setTimeout("javascript function",milliseconds);

함수가 아직 실행되지 않은 경우에는 clearTimeout() 메서드를 사용하여 함수 실행을 중지할 수 있습니다. 암호.

예제

다음은 동일한 예이지만 "알림 중지" 버튼이 추가되었습니다.

var myVar; 
function myFunction(){
    myVar=setTimeout(function(){alert("Hello")},3000);}
 function myStopFunction(){
    clearTimeout(myVar);}

JS의 타이밍 이벤트 사용 방법은 이 기사에 자세히 설명되어 있습니다. 중국사이트에서 시청 가능합니다.

관련 권장 사항:

JavaScript 클로저 이해 및 사용

JavaScript 쿠키 이해 및 사용

JavaScript 양식 유효성 검사에 대한 관련 설명

위 내용은 JavaScript 타이밍 이벤트 이해 및 사용의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!