Question

我对此代码有疑问：

    var par = [];
    $('a[name]').each(function() {
        if (($(this).attr('name')).indexOf("searchword") == -1) {
            par.push($(this).attr('name'));
            $('.content').empty();
            for (var i = 0; i < par.length; i++) {
                $(".content").append('<a id="par" href="#' + par[i] + '">' + par[i] + '</a><br />');
            }
        }
    });

它会导致ie和firefox弹出警告窗口“停止运行此脚本”。但只有在页面上存在非常大量的数据时才会发生这种情况。任何想法如何解决它？

Answer 1

您的代码应如下所示：

var par = [];
$('a[name]').each(function() {
    if (($(this).attr('name')).indexOf("searchword") == -1) {
        par.push($(this).attr('name'));
    }
});
$('.content').empty();
for (var i = 0; i < par.length; i++) {
    $(".content").append('<a id="par" href="#' + par[i] + '">' + par[i] + '</a><br />');
}

第二个循环没有理由在第一个循环中 - 这只会导致很多不必要的工作。

通过删除par数组和第二个循环，只需在第一个循环中创建内容，可以使这段代码更简单：

$('.content').empty();
$('a[name]').each(function() {
    var name = $(this).attr('name');
    if (name.indexOf("searchword") == -1) {
        $(".content").append('<a id="par" href="#' + name + '">' + name + '</a><br />');
    }
});

Answer 2

浏览器在单个线程上运行所有javascript（和大多数页面交互）。当您像这样运行一个没有中断的长循环时，UI完全冻结。您应该尝试让您的算法必须做得更少，但是如果不可能，你可以在你做一些工作的时候使用这个技巧，然后暂停并给浏览器控制UI线程一点，然后做更多的工作

var $targets = $('a[name]');
var current = 0;
var i = 0;
function doSomeWork() {
    if (i == $targets.length) return;

    var $t = $targets[i];
    if (($t.attr('name')).indexOf("searchword") == -1) {
        par.push($t.attr('name'));
        $('.content').empty();
        for (var i = 0; i < par.length; i++) {
            $(".content").append('<a id="par" href="#' + par[i] + '">' + par[i] + '</a><br />');
        }
    }
    i++;
    window.setTimeout(arguments.callee, 0);
}

这会在屈服之前在函数中进行一次循环迭代。在函数调用中做一个以上不仅仅是一个可能是个好主意，但你可以尝试一下。关于这个想法的文章：http://www.julienlecomte.net/blog/2007/10/28/

Jquery需要帮助 - 无限循环？

2 个答案: