DOMNodeInserted/ Удалены полифилы событий (или похожие события)

Мне нужен способ прослушать изменения, когда дочерние узлы удаляются или добавляются. Я сделал плагин с автопрокруткой, который удерживает элемент прокручиваемым вниз при добавлении новых элементов. Событие, которое я слушаю DOMNodeInserted а также DOMNodeRemoved,

Я искал полифилы для DOMNodeInserted а такжеDOMNodeRemoved, Оглядываясь вокруг, я не смог найти ничего, что уже существовало. Событие поддерживается не во всех браузерах и в настоящее время устарело. У меня есть простой (вероятно, наивный) полифилл, который я написал быстро, но сомневаюсь, что он работает (хорошо).

Я знаю, что эти события устарели, но есть ли лучший способ прослушать изменения дочерних элементов?

(function() {
    var works = false;
    var $test = document.createElement("div");
    var $testchild = document.createElement("a");

    $test.addEventListener("DOMNodeInserted", function() {
        works = true;
    }, false);

    $test.appendChild($testchild);

    if(!works) {
        var nodeproto = Node.prototype;
        var nativeAppend = nodeproto.appendChild;
        var nativeRemove = nodeproto.removeChild;

        nodeproto.appendChild = function() {
            nativeAppend.apply(this, arguments);
            this.fireEvent("DOMNodeInserted");
        };

        nodeproto.removeChild = function() {
            nativeRemove.apply(this, arguments);
            this.fireEvent("DOMNodeRemoved");
        };
    }
})();

1 ответ

Решение

Я закончил тем, что написал разумно совместимый polyfill для MutationObserver используя интервальные проверки клонированного childList (аналогично тому, что @plalx упомянул в своих комментариях) вместо MutationEvents. MutationEvents будет более производительным для большинства сценариев, так как любой опрос против реализации прерываний, но совместимость отстой

Простой пример автопрокрутки с использованием моей прокладки

Другие вопросы по тегам