> 웹 프론트엔드 > JS 튜토리얼 > Jquery_jquery에서 setInterval 및 setTimeout을 사용하는 방법

Jquery_jquery에서 setInterval 및 setTimeout을 사용하는 방법

WBOY
풀어 주다: 2016-05-16 17:38:05
원래의
1102명이 탐색했습니다.

방법 1. jQuery Extension을 적용하면 이 문제를 해결할 수 있습니다.

코드 복사 코드는 다음과 같습니다.

$(document ).ready (function(){
$.extend({
show:function(){
Alert("ready");
}
});
setInterval( "show( )",3000);
});


방법 2. 예약된 실행을 위한 함수를 지정할 때 따옴표와 괄호를 사용하지 마세요.

코드 복사 코드는 다음과 같습니다.

$(function (){
function show(){
Alert("ready");
}
setInterval(show,3000);// 함수 이름에는 따옴표와 대괄호가 없습니다.
// setInterval( "show()",3000)을 사용하면 "객체 누락"이 보고됩니다.
});

차이:

setTimeout()

표현식이나 함수를 실행하기 위해 지정된 시간을 지연합니다.
window.clearTimeout과 함께 사용됩니다.

setInterval()

실행 시 페이지를 로드한 후 지정된 간격으로 표현식이나 함수를 실행합니다. (함수는 재귀 함수와 유사합니다.)

추가 지침:

두 방법 모두 일정 시간이 지난 후 JavaScript를 실행하는 데 사용할 수 있습니다. 그러나 둘 다 고유한 적용 시나리오가 있습니다.

방법

실제로 setTimeout과 setInterval의 구문은 동일합니다. 그들은 모두 두 개의 매개 변수를 가지고 있습니다. 하나는 실행될 코드 문자열이고 다른 하나는 코드가 실행될 후의 시간 간격(밀리초)입니다.


그러나 두 함수에는 차이가 있습니다. setInterval은 코드를 한 번 실행한 후 지정된 시간 간격 후에 자동으로 코드를 반복 실행하는 반면, setTimeout은 해당 코드를 한 번만 실행합니다.

표면적으로는 setTimeout을 on-off 액션에만 적용할 수 있는 것처럼 보이지만 setTimeout을 반복적으로 호출하여 반복 작업을 수행하는 함수 루프를 만들 수 있습니다.

코드 복사 코드는 다음과 같습니다.
showTime();
function showTime ()
{
var today = new Date();
Alert("시간: " today.toString ());
setTimeout("showTime()", 5000);
}

이 함수가 호출되면 5초마다 시간이 표시됩니다. setInterval을 사용하는 경우 해당 코드는 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.
setInterval ("showTime()", 5000 );
function showTime()
{
var today = new Date();
Alert("시간: " today.toString ());
}

이 두 메소드는 매우 유사해 보일 수 있으며 표시되는 결과도 매우 유사하지만 둘의 가장 큰 차이점은 setTimeout 메소드는 5초마다 showTime 함수를 실행하지 않고 매 5초마다 실행한다는 점입니다. showTime을 실행합니다. setTimeout을 호출한 후 5초 후에 함수를 호출합니다. 즉, showTime 함수의 주요 부분을 실행하는 데 2초가 걸리면 전체 함수는 7초마다 실행됩니다. 그러나 setInterval은 호출하는 함수에 의해 바인딩되지 않으며 단순히 특정 시간에 해당 함수를 반복적으로 실행합니다.


정해진 시간 간격마다 정확하게 작업을 수행해야 하는 경우에는 setInterval을 사용하는 것이 가장 좋습니다. 연속 호출로 인해 상호 간섭을 일으키고 싶지 않은 경우, 특히 각 함수 호출마다 무거운 계산이 필요합니다. 처리 시간이 길면 setTimeout을 사용하는 것이 좋습니다.

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿