在Javascript中创建可插入DOM的内容的最佳方法是什么？

我看过一个关于创建内容并将内容附加到DOM的视频教程。他建议这样写一条线：

jQuery（'helloworld'）。appendTo（'article'）

与创建这样的对象相比，它是草率的：

jQuery（“”，{text:'helloworld'，class'myClass'}）

我仍然有点不相信这是最好的方法。例如，我这里有一个更复杂的DOM创建示例：-使用建议的方法在JS中创建元素比传递整个元素的字符串要慢得多

因此，创建具有JS可读性的对象的唯一好处是什么？如何在JS中创建元素？您只是传递要插入DOM的字符串，还是在JS中生成对象并以此方式构建对象？
最干净的解决方案是通过
createElement
方法创建元素，设置其属性，然后将其插入DOM

如果有更多元素，则构建相应的树，并在完成后将整个树插入dom

例如：

但是认真的说，谁想写这样的代码呢就我个人而言，我会坚持你的第一个例子，无论什么适合你。
而且从一段时间以前开始，它至少在Chrome浏览器中也优于.innerHTML。@Christoph当你说“坚持你的第一个例子”时，你是指jsperf测试页面上的第一个吗？因此，我在JS中构建对象。您是否认为这种方法更整洁、更干净，因此可以忽略将整个对象作为字符串传递的性能优势（如jsperf测试中的第二个示例）？@DaveHaigh我可能是错的，但如果您用一个真实的示例来考虑它：1。你有一个盒子，里面有4件物品。任务是把它抬到桌子上。2.你有一个空盒子。任务是先把4件东西放进盒子里，然后把它放在桌子上。哪种情况需要更少的时间？情景1。类似于你在#1和#2中所做的。与您在#2示例中所做的类似。（我不知道jquery如何组装每个应用程序的实际机制，但常识告诉我，#1已经组装好了，而#2还没有组装好。）@DaveHaigh澄清说：除非您有一个对性能绝对关键的应用程序，否则我建议您以提供最佳可读性和最适合您风格的方式编写它。对于普通的东西，它不会有任何明显的性能变化。我不是专家，但据我所知，使用后一种方法的原因之一是减少
JS
中
HTML
的数量，因为它不属于那里，并且增加了可读性。就可读性而言，您可以在代码中使用反斜杠作为换行符，如下所示：
function addElement()
{
  // create a new div element
  // and give it some content
  newDiv = document.createElement("div");
  newContent = document.createTextNode("Hi there and greetings!");
  newDiv.appendChild(newContent); //add the text node to the newly created div.

  // add the newly created element and it's content into the DOM
  my_div = document.getElementById("org_div1");
  document.body.insertBefore(newDiv, my_div);
}