使用 jQuery 附加到表时的 NOT_FOUND_ERR答案

【问题标题】：NOT_FOUND_ERR when appending to table using jQuery使用 jQuery 附加到表时的 NOT_FOUND_ERR
【发布时间】：2011-10-16 22:11:11
【问题描述】：

我确实发现了几个与 jQuery 结合使用的 NOT_FOUND_ERR: DOM Exception 8 错误的问题，但它们并没有发生在像我这样的场景中，因此它们没有提供解决方案。

基本上，我有一个对象，我正在对其进行迭代，然后将行添加到带有id="legend" 的<table>：http://jsfiddle.net/nt9gZ/。

var items  = [],
    obj    = {a: 1,
              b: 2};

$.each(obj, function(i, v) {
    items.push(
        $("<tr>").append(
            $("<td>").html(i),
            $("<td>").html(v)
        )
    );
});

// .empty() is to erase contents when running this piece of code again
$("#legend").empty().append(
                        $(items)
                     );

当我运行这段代码时，我得到了错误：

Uncaught Error: NOT_FOUND_ERR: DOM Exception 8

在 Chrome 上。

我不确定我的代码到底出了什么问题。

找不到什么？
我该如何解决这个问题？

【问题讨论】：

标签： javascript jquery dom append html-table

【解决方案1】：

试试这个jsfiddle

您应该遍历 items 数组中的项目并一个接一个地追加它们

【讨论】：

我假设 OP 希望避免按项目插入以避免页面重排/重绘。而是一次性完成，将回流降低到一次。
谢谢，但这似乎放弃了<tr>s。

【解决方案2】：

我已经稍微更新了你的代码：http://jsfiddle.net/nt9gZ/8/

数组基本上有问题 - append 方法不将 jQuery 对象数组作为参数，仅将元素序列作为参数。所以我使用add 方法将所有行收集在一起。

【讨论】：

谢谢。只是为了记录，我创建了一个简单的函数，它对当前的元素集执行某种.add。 jsfiddle.net/nt9gZ/10

【解决方案3】：

您正在尝试插入一个数组数组..

在将创建的对象推入数组时添加.get(0)，以便插入实际的DOM片段..

$.each(obj, function(i, v) {
    items.push(
        $("<tr>").append(
            $("<td>").html(i),
            $("<td>").html(v)
        ).get(0)
    );
});

http://jsfiddle.net/gaby/nt9gZ/7/ 上的演示

【讨论】：

【解决方案4】：

来自您的jsfiddle

在第一个参数中追加不期望数组。但是，阅读文档，第二个参数可以是一个数组。我无法设法传递一个数组并使其工作（作为第二个参数）。

【讨论】：

【解决方案5】：

我不熟悉你下面的代码

$("<tr>").append(
            $("<td>").html(i),
            $("<td>").html(v)
        )

但这是实现相同目的的另一种方法。

var items  = [],
obj = {a: 1, b: 2};

$.each(obj, function(i, v) {
    items.push("<tr>"+"<td>"+i+"</td><td>" + v +"</td></tr>");
});

$("#legend").append(items.join(""));

【讨论】：