0

データをループして html テーブルに追加するコードのスニペットがあります。

for(var i = 0; i < iRowCount; i++)
    {
        var sTempVal = aAdditionValues[i];
        var iStartColumn = 0;
        var iIndex = 0;

        var aTempVal = sTempVal.split("");          
        aTempVal.reverse();
        for(var r = iColCount - 1; r > 0; r--)
        {
            $("#additionTable tr:eq("+i+") td:eq("+r+")").append(aTempVal[iIndex]);             
            iIndex++;
        }
        iStartColumn = 0;
        iIndex = 0;
    }

配列aAdditionValues[i];は単なる数値の配列です。

実装できるパフォーマンスの向上はありますか?

4

4 に答える 4

2

現在、ループごとにDOMに何かを追加していますが、これは非常に非効率的です。DOMに追加する前に、まずJavaScriptに挿入するオブジェクトを作成し、1つのイベントに挿入します。これにより、ドキュメントの再描画に必要な計算が最小限に抑えられます。

于 2013-03-07T09:44:56.313 に答える
1

既存のテーブルの特定のセルを操作するため、改善の余地はあまりありません。少なくともjqueryセレクターをキャッシュすることをお勧めします：

var $table = $('#additionTable'); // outside the loop ofc
$("tr:eq("+i+") td:eq("+r+")", $table).append(/* ... */);
于 2013-03-07T09:49:23.023 に答える
1

DOM に何かを追加するたびに、DOM を再構築するため、多くのリソースが必要になります。それを埋めることによってテーブルを作成しcreateElement("table")、その後でのみ1つを行う方が高速になりますappend。

于 2013-03-07T09:49:54.707 に答える
1

小さな改善: 少なくとも を取り除きaTempVal.reverse();、最後からループを開始することができます。

iStartColumnまた、値を変更していないことを削除します。

于 2013-03-07T09:47:08.720 に答える