Question

我有一些类似于以下内容的脚本：

var breakpoints = [0,240,480,960,9999],
    bpCount = breakpoints.length,
    windowsize = 0;

window.onresize = function() {

    windowsize = document.body.clientWidth;

    for(var i=0; i<bpCount; i++) {
        if(windowsize >= breakpoints[i] && windowsize < breakpoints[i+1]) {
            doSomething(breakpoints[i]);
            break;
        }
    }    

};

然而，这似乎运行得相当慢，即使在一台不错的PC上的Chrome中，即使'doSomething'只是执行'console.log'，所以我只是想知道是否有更好的方法来检查是否屏幕大小在调整大小时介于两个值之间？

由于

Answer 1

不要每次轮询的尺寸。你的计算能力太强了。

相反，制作计时器并经常检查大小（10 ms可能太快）：

var checkWindowSizeTimer;

function checkWindowSize() {
    var windowsize = document.body.clientWidth;

    if (windowsize >= breakpoints[i] && windowsize < breakpoints[i+1]) {
        doSomething(breakpoints[i]);
        clearInterval(checkWindowSizeTimer);
    }
}

window.onresize = function() {
  checkWindowSizeTimer = setInterval(checkWindowSize, 10);
}

当窗口调整大小超过边界时，计时器退出。

加速窗口调整功能性能

1 个答案: