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 エンジンを備えた最新のブラウザーの場合であるかどうかはわかりません。innerHTMLさらに、HTML の塊をプロパティにドロップすることで得られるメリットの多くは、JSON表現からその HTML を作成する必要があることですが、これにも時間がかかります。オブジェクトを処理する必要があるためJSON、DOM 操作メソッドを使用することは賢明な設計アプローチです。

于 2012-04-04T06:21:29.873 に答える
1

DOM操作はよりクリーンなアプローチだと思います。マークアップ言語とビヘイビアー（JavaScript）を組み合わせinnerHTMLたビットspaghetti codeであり、最後に明確な構造がありません。さらに、最近のほとんどのブラウザでDOM APIは、パフォーマンスの点でより高速または同等ですinnerHTML。残念ながら、IEとOperaはそうではありません。

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

したがって、DOM APIsコードを少しクリーンアップして最適化することができます（たとえばgetElementById、commentsContainer参照を取得するためにすべてのループを実行する必要はなく、外部に置くことができます。また、毎回最初の子を削除する理由もわかりません。コメントを追加すると、以前に追加したコメントを削除できる可能性があります。その場合は、最適化することもできます）。

于 2012-04-04T06:35:08.437 に答える