[解決済み] [Solved] DOM Elementが削除された場合、そのリスナーもメモリから削除されるのですか？

質問

DOM Elementが削除された場合、そのリスナーもメモリから削除されますか？

解決方法は？

モダンブラウザ

プレーンなJavaScript

削除される DOM 要素が参照フリー (それを指す参照がない) である場合、次のようになります。 はい - 要素そのものと、それに関連するすべてのイベントハンドラ/リスナーは、ガベージコレクタに回収されます。

var a = document.createElement('div');
var b = document.createElement('p');
// Add event listeners to b etc...
a.appendChild(b);
a.removeChild(b);
b = null; 
// A reference to 'b' no longer exists 
// Therefore the element and any event listeners attached to it are removed.

しかし、まだその要素を指している参照がある場合、その要素とイベントリスナーはメモリに保持されます。

var a = document.createElement('div');
var b = document.createElement('p'); 
// Add event listeners to b etc...
a.appendChild(b);
a.removeChild(b); 
// A reference to 'b' still exists 
// Therefore the element and any associated event listeners are still retained.

jQuery

jQueryの関連するメソッド（例えば remove() を考えると)全く同じように機能するはずです。 remove() を使って書かれたものです。 removeChild() など）。

しかし これは真実ではない という内部メソッド（文書化されておらず、理論的にはいつでも変更可能）を持っています。 cleanData() (このメソッドは以下のようなものです。 は、DOM から削除されたときに、要素に関連するすべてのデータ/イベントを自動的にクリーンアップします (この経由であること)。 remove() , empty() , html("") など)。

旧ブラウザ

古いブラウザ、特にIEの古いバージョンでは、イベントリスナーがアタッチした要素への参照を保持するために、メモリリークの問題があることが知られています。

レガシー IE バージョンのメモリリークの原因、パターン、解決策についてより深く知りたい場合は、以下を読むことを強くお勧めします。 このMSDN記事は、「Understanding and Solving Internet Explorer Leak Patterns」です。

この他にも関連する記事がいくつかあります。

• JScriptのメモリリーク
• IE8でのメモリリーク
• JavaScriptのメモリリーク

リスナーを手動で削除することは、この場合、おそらく良い習慣になるでしょう（メモリがアプリケーションにとって重要で、実際にそのようなブラウザをターゲットにしている場合のみ）。