循环的Javascript运行顺序不正确

我有一个令人困惑的问题，我的函数中的一行代码在上面所述的循环之前运行。在我的HTML中，我有：

<textarea id="textBox"></textarea>
<button id="submitButton" onclick="parseData()">submit</button>
<div id="put"></div>

---

我不知道为什么最后的

会放在

for

循环运行之前，也不知道为什么没有在for循环中添加

标记。有任何指针吗？

每次将内容添加到

html（）

属性，而不是构建整个内容并添加它时

因为您使用的是jQuery，所以可以使用jQuery绑定事件，而不是直接将其添加到HTML中

<textarea id="textBox"></textarea>
<button id="submitButton">submit</button>
<div id="put"></div>

$(function(){
    $("#submitButton").click(function(){
        parseData();
    });

    function parseData() {
        var data = $("#textBox").val();
        var tab = /\t/;
        data = data.split(tab);

        // Build your html
        $("#put").html('htmlstructure');
        return;
    }
});

提交
$（函数（）{
$（“#提交按钮”）。单击（函数（）{
解析数据（）；
});
函数parseData（）{
var数据=$（“#文本框”）.val（）；
var tab=/\t/；
data=data.split（选项卡）；
//构建你的html
$（“#put”）.html（'htmlstructure'）；
返回；
}
});

此外，您还可以查找类似的内容，例如在数组中连接字符串，这样就不会在每次追加时都创建字符串ISNTANCE，因为字符串是不可变的

---

每次将内容添加到

html（）

属性时，而不是构建整个内容并添加它

因为您使用的是jQuery，所以可以使用jQuery绑定事件，而不是直接将其添加到HTML中

<textarea id="textBox"></textarea>
<button id="submitButton">submit</button>
<div id="put"></div>

$(function(){
    $("#submitButton").click(function(){
        parseData();
    });

    function parseData() {
        var data = $("#textBox").val();
        var tab = /\t/;
        data = data.split(tab);

        // Build your html
        $("#put").html('htmlstructure');
        return;
    }
});

提交
$（函数（）{
$（“#提交按钮”）。单击（函数（）{
解析数据（）；
});
函数parseData（）{
var数据=$（“#文本框”）.val（）；
var tab=/\t/；
data=data.split（选项卡）；
//构建你的html
$（“#put”）.html（'htmlstructure'）；
返回；
}
});

此外，您还可以查找类似的内容，例如在数组中连接字符串，这样就不会在每次追加时都创建字符串ISNTANCE，因为字符串是不可变的

---

jQuery在插入标签时自动关闭标签。试试这个

function parseData() {
    var data = $("#textBox").val();
    var tab = /\t/;
    var put_html = $("#put").html() + "<table>";
    data = data.split(tab);
    for (var i = 0; i < data.length; i++) {
        put_html += "<tr>"+data[i]+"</tr>";
    };
    put_html += '</table>';
    $("#put").html(put_html);
    return;
};

函数parseData（）{
var数据=$（“#文本框”）.val（）；
var tab=/\t/；
var put_html=$（“#put”）.html（）+”；
data=data.split（选项卡）；
对于（变量i=0；i

---

但是，我注意到您没有使用

元素。您可能也需要研究如何解决这个问题。

jQuery在插入标签时自动关闭标签。试试这个

function parseData() {
    var data = $("#textBox").val();
    var tab = /\t/;
    var put_html = $("#put").html() + "<table>";
    data = data.split(tab);
    for (var i = 0; i < data.length; i++) {
        put_html += "<tr>"+data[i]+"</tr>";
    };
    put_html += '</table>';
    $("#put").html(put_html);
    return;
};

函数parseData（）{
var数据=$（“#文本框”）.val（）；
var tab=/\t/；
var put_html=$（“#put”）.html（）+”；
data=data.split（选项卡）；
对于（变量i=0；i

---

但是，我注意到您没有使用

元素。您可能也需要考虑解决这个问题。

您不能将部分HTML添加到

HTML（）

，它需要有效的HTML，带有开始和结束标记等。因此它可以构建元素。改为使用变量存储HTML字符串，并在循环完成后仅使用一次

HTML（）

。您还应在附加之前连接整个HTML字符串-这将使上面的代码更干净并提高性能。您不能将部分HTML添加到

HTML（）

，它需要有效的HTML，具有开始和结束标记等，因此它可以构建元素。改为使用变量存储HTML字符串，并在循环完成后仅使用一次

HTML（）

。在附加之前还应连接整个HTML字符串-这将使上面的代码更干净并提高性能。完美-不知道jQuery自动关闭标记。非常感谢！

这件事是我在测试解决方案时意外删除的-谢谢提醒。完美-我不知道jQuery自动关闭标签。非常感谢！

这件事是我在测试解决方案时意外删除的-谢谢提醒。