3

我有这个代码：

try {
    var _o, _l, i, _d = new Array(), _c;
    _o = JSON.Parse( Request.Response );
    for ( i = 0, _l = _o.length; i < _l; i++ ) {
        _d[ i ] = document.createElement('div');
        _c = document.getElementById('comentsContainer');
        _c.removeChild( _c.firstChild );
        _d[ i ].className = 'comment-user';
        _c.appendChild( _d [i] );
    }
}
catch ( w ) {
    console.log( w );
}

问题是，这种方式更好还是我应该使用 innerHTML ？

添加：要解析的对象：

"comments" : [
  { "user" : "foo", "comment" : "foo", "date" : "foo/foo/bar", "id_comment" : "bar" },
  { /* the same as above x10 */ }
]

请注意，我想将每个数组中的每个对象解析为 DOM 元素

4

2 回答 2

2

由于您在这里已经有了数据的结构表示（而不是要解析的原始 HTML），我想说您的方法（使用 DOM 操作方法）比使用围绕.innerHTML. 在某些情况下，.innerHTML已经证明是性能上的胜利，但我不确定在具有良好 JavaScript 引擎的现代浏览器上是否会出现这种情况。此外，将一个 HTML 块放入属性中可能会获得的很多好处innerHTML是，无论如何您都必须从您的JSON表示中构建该 HTML，这也需要时间。由于您必须处理JSON对象，因此使用 DOM 操作方法是一种明智的设计方法。

于 2012-04-04T06:21:29.873 回答
1

我会说DOM操作是一种更简洁的方法：innerHTML有点spaghetti code，您将标记语言与行为（JavaScript）混合在一起，并且最后没有清晰的结构。此外，在大多数现代浏览器中，在性能DOM API方面都更快或相当innerHTML——不幸的是 IE 和 Opera 并非如此：

http://jsperf.com/innerhtml-or-dom/4

所以，去吧DOM APIs，也许你可以清理和优化你的代码（例如，你不需要执行getElementById每个循环来获取 commentsContainer 引用，你可以把它放在外面；也不知道为什么你每次都删除第一个孩子您添加评论，在我看来，您可能会删除之前添加的评论，在这种情况下也可以进行优化）。

于 2012-04-04T06:35:08.437 回答