当你传递一个HTML字符串给任何jQuery的方法时，会发生这样的事情:

一个临时元素被创建，让我们称之为x。x的innerHTML被设置为你传递的HTML字符串。然后jQuery将每个生成的节点(即x的childNodes)转移到新创建的文档片段中，然后缓存该文档片段以备下次使用。然后它会返回片段的childNodes作为一个新的DOM集合。

请注意，实际情况要复杂得多，因为jQuery做了大量跨浏览器检查和各种其他优化。例如，如果你将<div></div>传递给jQuery()， jQuery会采取一个快捷方式，简单地执行document.createElement('div')。

编辑:要查看jQuery执行的大量检查，请查看这里、这里和这里。

innerHTML通常是更快的方法，但不要让它一直控制您的工作。jQuery的方法不像element那么简单。innerHTML =…-正如我提到的，有很多检查和优化正在进行。

正确的技巧在很大程度上取决于具体情况。如果想要创建大量相同的元素，那么最后要做的事情就是创建一个巨大的循环，在每次迭代时创建一个新的jQuery对象。例如，用jQuery创建100个div的最快方法:

jQuery(Array(101).join('<div></div>'));

还有可读性和维护方面的问题需要考虑。

这样的:

$('<div id="' + someID + '" class="foobar">' + content + '</div>');

．.． 比这个更难维护

$('<div/>', {
    id: someID,
    className: 'foobar',
    html: content
});

你可以用第二种方法来达到同样的效果:

var mySecondDiv = $('<div></div>');
$(mySecondDiv).find('div').attr('id', 'mySecondDiv');
$('#myDiv').append(mySecondDiv);

Luca提到html()只是插入html，这导致了更快的性能。

在某些情况下，你会选择第二种方法，考虑:

// Clumsy string concat, error prone
$('#myDiv').html("<div style='width:'" + myWidth + "'px'>Lorem ipsum</div>");

// Isn't this a lot cleaner? (though longer)
var newDiv = $('<div></div>');
$(newDiv).find('div').css('width', myWidth);
$('#myDiv').append(newDiv);

嗯，.html()使用. innerhtml，这比DOM创建更快。

如果你的.add是指.append，那么如果#myDiv是空的，结果也是一样的。

表演一样吗?不知道。

.html(x)最终会做与.empty().append(x)相同的事情

.html()将替换所有内容。

.append()只会在结尾追加。

当你传递一个HTML字符串给任何jQuery的方法时，会发生这样的事情:

一个临时元素被创建，让我们称之为x。x的innerHTML被设置为你传递的HTML字符串。然后jQuery将每个生成的节点(即x的childNodes)转移到新创建的文档片段中，然后缓存该文档片段以备下次使用。然后它会返回片段的childNodes作为一个新的DOM集合。

请注意，实际情况要复杂得多，因为jQuery做了大量跨浏览器检查和各种其他优化。例如，如果你将<div></div>传递给jQuery()， jQuery会采取一个快捷方式，简单地执行document.createElement('div')。

编辑:要查看jQuery执行的大量检查，请查看这里、这里和这里。

innerHTML通常是更快的方法，但不要让它一直控制您的工作。jQuery的方法不像element那么简单。innerHTML =…-正如我提到的，有很多检查和优化正在进行。

正确的技巧在很大程度上取决于具体情况。如果想要创建大量相同的元素，那么最后要做的事情就是创建一个巨大的循环，在每次迭代时创建一个新的jQuery对象。例如，用jQuery创建100个div的最快方法:

jQuery(Array(101).join('<div></div>'));

还有可读性和维护方面的问题需要考虑。

这样的:

$('<div id="' + someID + '" class="foobar">' + content + '</div>');

．.． 比这个更难维护

$('<div/>', {
    id: someID,
    className: 'foobar',
    html: content
});