Наблюдение за содержимым конкретного DIV

Question

Есть ли способ наблюдать за содержимым определенного DIV, я хочу вызвать функцию, как только содержимое DIV будет изменено.

Это может быть замена innerHTML, загрузка страницы.

Спасибо

Answer 1

В современных браузерах вы можете использовать события мутации DOM , например DOMSubtreeModified, DOMCharacterDataModified.В IE у вас есть onchange событие, которое вы можете использовать.Для всех других браузеров вы можете настроить таймер для проверки, был ли изменен контент.

Answer 2

Вы можете проверить содержимое элемента, сравнивая его с предыдущим значением.

Получить элемент для просмотра

var div = document.getElementById("w");

Создать наблюдатель:

var w1 = { watch: null, prev: div.innerHTML };

Запустите наблюдателя.Каждые 100 мс он будет сравнивать предыдущее значение с текущим, если он отличается, он будет обновлять значение и запускать любые действия.

function Watch(w, e)
{
    w.watch = setInterval(function() {
       if (e.innerHTML != w.prev)
       {
           w.prev = e.innerHTML;
           alert("changed");
       }
    }, 100);
}

Watch(w1, div);

См. Этот пример на jsFiddle.

Answer 3

На этой странице написано, что DIV должны запускать OnChange при изменении их содержимого.

Наблюдение за изменением не является эффективной техникой.Вы пытались получить код, который изменяет содержимое DIV для запуска и события?

В качестве альтернативы вы можете установить таймер, который отслеживает изменения в вашем div и запускает какое-то событие.