jquery - $.append() 和 $.append(document.createTextNode()) 之间的区别

Question

使用以下 html

<div id="duo">batman</div>

以下两行 jQuery 代码有什么区别？

$('#duo').append(' and robin');

$('#duo').append(document.createTextNode(' and robin'));

他们都生产

<div id="duo">batman and robin</div>

第一个 html 和第二个只是一个字符串吗？有关系吗？这意味着什么以及差异意味着什么？

---

编辑

如果引号内的文本是 ' and <em>robin</em>' 会怎样？ ？似乎前一个语句会产生强调的文本，而后者实际上呈现可见 <em>页面上的标签。

Answer 1

结果是一样的，唯一的区别是 jQuery 在第一行创建文本节点。

如果您使用 DOM 方法查看结果(因为 jQuery 使用元素而不是节点)，您会看到创建的文本节点:

$('#duo').append(' and robin');
$('#duo').append(document.createTextNode(' and robin'));

var c = document.getElementById('duo').childNodes;
for (var i = 0; i < c.length; i++) {
    console.log(c[i]);
}

输出:

<TextNode textContent="batman">
<TextNode textContent=" and robin">
<TextNode textContent=" and robin">

fiddle :http://jsfiddle.net/Guffa/tgqz37m5/