DOMNodeInserted эквивалент в IE?

Ответ 1

Нет, нет. Ближайшим является событие propertychange, которое срабатывает в ответ на изменение атрибута или свойства CSS элемента. Он срабатывает в ответ на изменение свойства innerHTML элемента непосредственно, но не тогда, когда содержимое элементов изменяется некоторыми другими способами (например, с помощью DOM-методов, таких как appendChild() или путем изменения innerHTML дочернего элемент).

ОБНОВЛЕНИЕ 6 февраля 2014 г.

Как отмечено в комментариях, существует обходное решение. Это основано на сложном взломе, и я рекомендовал бы вместо этого использовать наблюдателей за мутацией, где это возможно. См. ответ @naugtur для деталей. Ответ @naugtur был удален, но решение можно найти на https://github.com/naugtur/insertionQuery

Ответ 2

Вы можете использовать все методы DOM-манипуляции - appendChild, insertBefore, replaceChild, insertAdjacentHTML и т.д. - и контролировать innerHTML с помощью onpropertychange.

Возможно, вы сможете найти решение, соответствующее вашим требованиям.

Кстати, кажется, что DOMNodeInserted и т.д. в будущем будут устаревать браузерами. См. http://www.w3.org/TR/DOM-Level-3-Events/#events-mutationevents

Ответ 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

Ответ 4

Грязное обходное решение заключается в том, чтобы перехватить прототипные методы типа Element следующим образом:

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);
});

Ответ 5

Использование onreadystatechange, предложенное Paul Sweatte, действительно не работает. Событие readystatechange запускается только при загрузке foo.htc. Это не имеет ничего общего с изменением DOM node.

Я показал небольшую скрипку, чтобы продемонстрировать это. Посмотрите http://jsfiddle.net/Kermit_the_frog/FGTDv/ или http://jsfiddle.net/Kermit_the_frog/FGTDv/embedded/result/.

HTML:

<input type="button" id="fooBtn" value="add" />
<div id="fooDiv"></div>

JS/Jquery:

function bar(e) {
    var state = $('#fooDiv').get(0).readyState;
    alert (state);
}

$("#fooBtn").on("click", function(){
    $('#fooDiv').get(0).addBehavior("foo.htc");
    $('#fooDiv').get(0).attachEvent("onreadystatechange", bar);
});

Как вы можете видеть: даже если манипуляция DOM отсутствует, происходит событие readystatechange.

Ответ 6

Похоже, поведение DHTML можно использовать в IE для эмуляции DOMNodeInserted.