0

我看过一个关于创建内容并将内容附加到 DOM 的视频教程。他建议像这样写一个字符串:

jQuery('<h2 class=myClass>Hello world</h2>').appendTo('article');

与创建这样的对象相比是草率的:

jQuery('<h2></h2>', {text: 'Hello world', class 'myClass'}).appendTo('article');

我仍然有点不相信这是最好的方法。例如,我在这里有一个稍微复杂一点的 DOM 创建示例:- http://jsperf.com/string-creation-dave使用建议的在 JS 中创建元素的方法比传递整个元素的字符串要慢很多.

因此,创建具有 JS 可读性的对象的唯一好处是什么?如何在 JS 中创建元素?您是只传递要插入到 DOM 中的字符串,还是在 JS 中生成对象并以这种方式构建对象?

4

1 回答 1

1

最干净的解决方案是通过createElement方法创建元素,设置其属性,然后将其插入到 dom 中。

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

来自 MDN 的示例:

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);
}

但很严肃,谁想写这样的代码;)我个人会坚持你的第一个例子,无论你适合什么。

于 2012-04-19T10:13:19.120 回答