javascript - DOMNodeInserted は IE で同等ですか?

Question

タイマーを使用して時間の経過とともに要素の数をカウントし、変化を探す以外に、このイベントをシミュレートするより良い方法は思いつきません。

ある種の独自の IE バージョンの DOMNodeInserted はありますか? ありがとう。

Answer 1

いいえ、ありません。最も近いのはpropertychange、要素の属性または CSS プロパティの変更に応答して発生するイベントです。要素のinnerHTMLプロパティが直接変更された場合に発生しますが、要素の内容が他の手段によって変更された場合には発生しません (たとえば、DOM メソッドを使用するappendChild()か、子要素の を変更することによってinnerHTML)。

2014 年 2 月 6 日更新

コメントで指摘されているように、回避策があります。これは精巧なハックに基づいており、可能な限り代わりにミューテーション オブザーバーを使用することをお勧めします。詳細については、@naugtur の回答を参照してください。@naugtur の回答は削除されましたが、解決策はhttps://github.com/naugtur/insertionQueryにあります。

Answer 2

すべての DOM 操作メソッド (appendChild、insertBefore、replaceChild、insertAdjacentHTML など) をオーバーライドし、onpropertychange で innerHTML を監視できます。

要件を満たすソリューションを思いつくことができるかもしれません。

ところで、DOMNodeInserted などは、将来的にブラウザーによって非推奨になるようです。http://www.w3.org/TR/DOM-Level-3-Events/#events-mutationeventsを参照してください。

Answer 3

onreadystatechangeはIEで機能します。DHTMLの動作は、htcを介して要素にアタッチする必要がありますが、htcファイルが存在する必要はありません。

if (!!document.addEventListener)
  {
  $(domnode).get(0).addEventListener("DOMNodeInserted", fixtext, false);
  }
else
  {
  $(domnode).get(0).addBehavior("foo.htc");
  $(domnode).get(0).attachEvent("onreadystatechange", fixtext);
  }

onreadystatechangeイベントリファレンス

Answer 4

A dirty workaround is to intercept the prototype methods of type Element as follows:

window.attachEvent('onload', function() {
    invokeNodeInserted(document);
    (function(replace) {
        Element.prototype.appendChild = function(newElement, element) {
            invokeNodeInserted(newElement);
            return replace.apply(this, [newElement, element]);
        };
    })(Element.prototype.appendChild);
    (function(replace) {
        Element.prototype.insertBefore = function(newElement, element) {
            invokeNodeInserted(newElement);
            return replace.apply(this, [newElement, element]);
        };
    })(Element.prototype.insertBefore);
    (function(replace) {
        Element.prototype.replaceChild = function(newElement, element) {
            invokeNodeInserted(newElement);
            return replace.apply(this, [newElement, element]);
        };
    })(Element.prototype.replaceChild);
});

Answer 5

DHTML Behaviors は IE でエミュレーティブに使用できるようですDOMNodeInserted。