Question

我的问题很简单，也可能是主观的。在大多数情况下，当我操作DOM时，我创建HTML文本并将其附加到元素。有时，如果数据足够小，我将创建元素并将它们附加到父元素。

$("#p").html("<p>My Paragraph</p>");

OR

$("<p/>").html("My Paragraph").appendTo("#p");

应该使用以下哪些？为什么？

Answer 1

jQuery有一种更优雅的方式来创建元素：

var $p = $("<p/>", {
    html: "My paragraph"
}).appendTo("#p");

创建元素的最大价值在于您可以保存对它们的引用，然后根据需要使用它们。无需使用$()选择器再次找到它们。

另一方面，如果您的HTML非常简单，以后不需要访问任何这些元素，那么使用.html()方法就可以了。而且速度稍快。

Answer 2

我认为最好使用第一个，因为它取决于页面的结构，而第二个则与更有可能改变的内容有关。我不了解表现，如果这更符合你的要求。

Answer 3

在我的拙见中，我只是简单地不喜欢第二种选择的外观。在语义上，你永远不应该在标记中的任何地方看到<p/>，所以使用它感觉很奇怪（即使我知道它在添加到DOM之前已经填充）。第一个例子看起来更清晰。

纯粹是一种偏好问题，而且我强烈支持代码可读性优于优化，直到您真正感受到性能损失。

Answer 4

看起来像

$("#p").html("<p>My Paragraph</p>");