Question

我有这个横幅旋转码：

function ban_rot() {
    //First preload images
    // counter
    var i = 0;

    // create object
    imageObj = new Image();

    // set image list
    images = new Array();
    images[0] = "../Graphics/adv/1.gif"
    images[1] = "../Graphics/adv/2.jpg"

    // start preloading
    for (i = 0; i <= images.length; i++) {
        imageObj.src = images[i];
    }
    ///////////////////////
    var links = new Array("http://www.link1.com", "http://www.link2.se");
    var alts = new Array("alt1", "alt2");
    var titles = new Array("title1", "title2");

    var counter = 0;
    var banner_div = document.getElementById("ban_rot");
    cycle();

    function cycle() {
        if (counter == links.length) {
            counter = 0;
        }
        else if (counter < links.length) {
            banner_div.innerHTML = '<a href=\"' + links[counter] + '\"><img src=\"' + images[counter] + '\" border=\"1px\" style=\"border-color:#000;\" alt=\"' + alts[counter] + '\" title=\"' + titles[counter] + '\"></a>';
            //increase counter
            counter++;
        }
        setInterval(cycle, 8000);
    } //end cycle function
} //end ban_rot function

使用此代码，在Firefox或Chrome中大约2-3分钟后，内存会上升，cpu会上升到50％左右。电脑变得迟钝，我不得不终止Chrome和FF。

上面这段代码中是否有任何理由？

由于

Answer 1

在此使用setTimeout()代替setInterval()，如下所示：

setTimeout(cycle, 8000);

使用setInterval()，你每次都会排队越来越多的函数堆栈，而不是在8秒后调用它，我们排队另一个间隔计时器，每8秒运行一次，所以你得到了这样：

8秒：1次运行
16秒：2次
24秒：4次
32秒：8次
......呃哦

使用setTimeout()，当计时器启动时，您只需运行一次，而不是每8秒运行一次附加。

要清楚，这种情况发生，因为你每次运行都会调用它，正常的一次性使用这不会是一个问题，{{3}没有任何内在的恶意}。

为什么这个javascript代码制作浏览器会占用50％的CPU和如此多的内存？

1 个答案: