## requestAnimationFrame `requestAnimationFrame`是瀏覽器用于定時循環操作的一個接口，類似于setTimeout，主要用途是按幀對網頁進行重繪。 可以使用`requestAnimationFrame()`來制作動畫。 > 如果你想做逐幀動畫的時候，你應該用這個方法。這就要求你的動畫函數執行會先于瀏覽器重繪動作。通常來說，被調用的頻率是每秒60次，但是一般會遵循W3C標準規定的頻率。如果是后臺標簽頁面，重繪頻率則會大大降低。 > 回調函數只會被傳入一個DOMHighResTimeStamp參數，這個參數指示當前被 requestAnimationFrame 序列化的函數隊列被觸發的時間。因為很多個函數在這一幀被執行，所以每個函數都將被傳入一個相同的時間戳，盡管經過了之前很多的計算工作。這個數值是一個小數，單位毫秒，精確度在 10 μs。 `requestAnimationFrame()`函數是全局函數。 考慮兼容，如下： ``` var requestAnimFrame = function() { return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || function(a) {window.setTimeout(a, 1e3 / 60, (new Date).getTime())}; }(); ``` 使用方法： ``` function step(){ requestAnimationFrame(step); } ``` requestAnimationFrame()方法會返回一個requestID，是一個長整型非零值，作為一個唯一的標識符，可將該值作為參數傳遞給window.cancelAnimationFrame()來取消這個函數。 ``` cancelAnimationFrame(requestID); ``` 兼容性代碼： ``` var cancelAnimFrame = function() { return window.cancelAnimationFrame || window.webkitCancelAnimationFrame || window.mozCancelAnimationFrame || function(id) { clearTimeout(id); }; }(); ```