JavaScript函数使我的浏览器崩溃

javascript function crashes my browser

本文关键字:浏览器 崩溃 我的 函数 JavaScript      更新时间:2023-09-26

我编写了一个简单的程序,它采用 2 个文本区域,并将一个文本区域的每一行与第二个文本区域中的所有行组合在一起,我的浏览器在 6000 行后崩溃。我的支票需要达到 100,000 行。

这是javascript代码:

function go() {
    var lines1 = $('#text1').val().split(/'n/);
    var lines2 = $('#text2').val().split(/'n/);
    var textarea1 = [];
    var textarea2 = [];
    var textarea3 = [];
    for (var i = 0; i < lines1.length; i++) {
        if (/'S/.test(lines1[i])) {
            textarea1.push($.trim(lines1[i]));
        }
    }
    for (var j = 0; j < lines2.length; j++) {
        if (/'S/.test(lines2[j])) {
            textarea2.push($.trim(lines2[j]));
        }
    }
    for (var k = 0; k < lines1.length; k++) {
        for (var q = 0; q < lines2.length; q++) {
            textarea3.push($.trim(lines1[k] + ' ' + lines2[q]));
            var msg = textarea3.join("'n");
            document.getElementById('text3').value = msg;
        }
    }
}

这是 HTML:

<textarea name="textarea" id="text1"></textarea>
<textarea name="textarea" id="text2"></textarea>
<input type="button" value="GO!" onclick="go()">
<br />
<textarea name="textarea" id="text3"></textarea>

问题出在这段代码上

    for (var k=0; k < lines1.length ; k++) {
        for (var q=0; q < lines2.length ; q++) {
            textarea3.push($.trim(lines1[k] + ' ' + lines2[q]));
            var msg = textarea3.join("'n");
            document.getElementById('text3').value = msg;
        }
    }

如果 textarea1 中有 1K 行,testarea2 中有 1K 行,那么你将修改 DOM(通过更改 textarea3 的值)1M 倍,这太疯狂了。因此,不要每次都更新 DOM,而是尝试在循环外进行更新。

尝试在文本区域中提供最大长度属性,然后检查我认为它会起作用。

在你的 for 循环中,

首先将所有内容存储在一个变量中,然后在 for 循环之外将其写入 textarea,而不是每次在 for 循环中分配 DOM 值。