方法1:のsetTimeout()を使用。
機能sayHi(){ 警告( "こんにちは。" ); } のsetTimeout(sayHi、 2000)。
方法2:使用window.requestAnimationFrameに();
VAR要素=のdocument.getElementById( 'アニメイト' ); element.style.position = '絶対' ; VARスタート= ヌル; 関数STEP(タイムスタンプ){ IFスタート=(スタート!) 、タイムスタンプ、 VaRの進捗状況=タイムスタンプ- スタート; / / 要素は左に進み、最大値は200個のピクセルを超えていない = Math.min(進行/ 10、200である)element.style.left +「PXを」; // 最初のパフォーマンスの距離が2000ミリ秒を超えない場合、 //は続行しますアニメーション IF(進捗<2000 ){ にwindow.requestAnimationFrame(STEP); } } (STEP)にwindow.requestAnimationFrame。
両者の差:
setTimeout()を高めるのに役立ちますDOMを操作する必要が手動で遅延時間を設定し、requestAnimationFrameの()がブラウザリフロー次回まで延期することが実行される。したがって、前者はより一般的であり、主に放電方法の関数である必要がパフォーマンス;
注意:
コールバック関数の実行をキャンセルするために使用することができるwindow.cancelAnimationFrame()。
方法3:使用window.requestIdleCallback()関数は、システムリソースへの内部遅延される実行されたとき、自由です。
)使用及びwindow.requestAnimationFrame()は類似しているが、異なる延期条件も:. Window.cancelIdleCallback(の実行をキャンセルする方法を有します
requestIdleCallback(myNonEssentialWork)。 関数myNonEssentialWork(締め切り){ 一方(deadline.timeRemaining()> 0 ){ doWorkIfNeeded()。 } }