DOM要素への参照の格納

Question

私が書いている特定のスクリプトでは、いくつかのDOM要素にリンクされたオブジェクトがいくつかあります。各要素に一意のIDがある場合、各オブジェクトは要素のIDだけを保持し（たびにdocument.getElementByIdを使用するか）、その要素をプロパティに格納する必要がありますか？

ここで私が何を意味するかの簡単な例です：

function myThing(elId) { 
    this.elId = elId; 
} 
myThing.prototype.getElValue = function() { 
    return document.getElementById(this.elId).nodeValue; 
}; 

// -- vs -- // 

function myThing(elId) { 
    this.el = document.getElementById(elId); 
} 
mything.prototype.getElValue = function() { 
    return this.el.nodeValue; 
}; 

が、それはどんな違いがありますか？私が知るべき性能上の問題はありますか？

Answer 1

私は要素を格納します。 document.getElementByIdを常に呼び出さなければコードを明確にする傾向がありますが、IDを変更する必要はなく、IDのない要素を許可する必要はないかもしれませんが、そうしたいのはかなり一般的です。

（getElementByIdのはかなりのブラウザでよく最適化される傾向にあるようapphackerと違って、私は、そうすることから巨大な効率の改善を期待していない。）

は、私が知っておくべきすべてのパフォーマンスの問題はありますか？

JavaScriptオブジェクトからDOMオブジェクトへの参照は単独で問題ありませんが、DOMオブジェクトにそのようなJavaScriptオブジェクト（通常はイベントハンドラを介して）へのリンクがある場合、参照サイクルがあります。 IE6-7は、リサイクルされたオブジェクトを解放することができないので、メモリをリークさせます。小さなシンプルなアプリの場合、気にしないかもしれません。複雑で長時間走っているアプリケーションの場合、DOMオブジェクトから実際のイベントハンドラへの直接の参照がないように、ルックアップマップ/配列を通じてすべてのイベントハンドラを間接的に渡すなど、問題を回避する必要があります。

Answer 2

IDを格納しないで、ルックアップが遅く、高価であり、関数呼び出しを保存します。私は単純なテストでこれを確認すると思います。