Question

我注意到这是一种奇怪的行为。我没有重置文件，但是在我附加文件后立即使用它，并且它包含的先前元素不在那里。

我应该这样清理吗？

frag_inner = '';

是否有我不知道的副作用？

frag_outer = NS.createDocumentFragment();
frag_inner = NS.createDocumentFragment();

NS.eachIndex(obj, function(val) {

    // fragment element - inner

    // image element

    val.view_picture = (val.picture === '0') ? this.A.images + 'generic_large.jpg' :
            this.A.pictures + val.h_file  + '-2.jpg';
    img_element = $A.createElement('img');
    img_element.className = 'tweet';
    img_element.src = val.view_picture;
    frag_inner.appendChild(img_element);

    // link element

    link_element = $A.createElement('a');
    link_element.className = 'tweet';
    link_element.innerHTML = val.name + ' posted ' +
            this.prettyTime(val.time) + '<br>';
    frag_inner.appendChild(link_element);

    // paragraph element

    par_element = $A.createElement('p');
    par_element.className = 'tweet';
    par_element.innerHTML = val.tweet;
    frag_inner.appendChild(par_element);

    // div element

    div_element = $A.createElement('div');
    div_element.className = 'tweet';
    div_element.appendChild(frag_inner);

    // append the div which is now populated

    frag_outer.appendChild(div_element);

}, this);

Answer 1

我认为这实际上是预期的行为，因为......

1）移动现有节点是Node.appendChild的一个众所周知的特性。如文档中所述（MDN）...

[Node.appendChild] ...将节点添加到指定子节点列表的末尾父节点。如果节点已存在，则将其从当前删除父节点，然后添加到新的父节点。

2）当您追加documentFragment时，实际上会附加其所有子项（MDN）：

各种其他方法可以将文档片段作为参数（例如，任何Node接口方法，如Node.appendChild和 Node.insertBefore），在这种情况下片段的子节点是附加或插入，而不是片段本身。

关键是，当你执行someNode.append（documentFragment）时，从中删除所有子节点，然后将它们附加到someNode。这就是documentFragment结果为空的原因。

请注意，当你这样做时......

frag_inner = '';

...你没有清除存储在这个变量中的documentFragment - 你会在其中存储一个新值（显然是一个空字符串）。与documentFragment一样，第一次尝试使用它应该会产生类似TypeError: Object has no method 'appendChild'的内容。

documentFragment元素是否自行重置？

1 个答案: