Изменение состояния DOM
Постараюсь изложить задачу кратко.
Искал на здесь на форуме решение, перелопатил стековерфлов, но того что нужно не нашел. Подскажите как можно отслеживать изменения в DOM (добавление новых элементов, присвоение класов, изменение атрибутов и т.д.). В процессе поиска нашел события DOMMutationEvents, но вместе с ними полно жалоб на поддержку в браузерах. Пробовал решить задачу с помощью костыля: периодически проверять количество нодов в документе, но так нельзя проверить изменение атрибутов. Приведите пожалуйста пример скрипта, который будет кросбраузерным, будет проверять изменения в DOM. Желательно реальный работающий пример без костылей Буду благодарен за помощь. |
Так вам кроссбраузероно или без костылей?)
|
На ваше усмотрение. Из двух зол выбирайте меньше. Главное чтобы работало)
|
MutationObserver
<body>
<div type="button" onclick="this.innerHTML='<span>clicked</span>'">click</div>
<script>// select the target node
var target = document.querySelector('body');
// create an observer instance
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
alert(mutation.type+'\n'+[].join.call(mutation.addedNodes,','));
});
});
// configuration of the observer:
var config = { attributes: true, childList: true, subtree: true };
// pass in the target node, as well as the observer options
observer.observe(target, config);
// later, you can stop observing
//observer.disconnect();
</script>
</body>
А для старых ie придётся танцевать с бубном. В интернете гулится вроде всякое на эту тему. На самом деле необходимости в подобных вещах при нормальной разработке нет. Вообще нет. Если какая-то функция что-то меняет в dom - вам надо просто следить за этой функцией, а не последствиями. |
Задача в тому, что сторонние скрипты изменяют DOM, а мой скрип должен следить за этими изменениями и реагировать некими действиями.
|
Можно проверять на изменение innerHTML.
|
Вообще правильный подход: проанализировать подключаемые скрипты, и подменять конкретные функции.
|
Сдается мне, такой скрипт должен будет через интервалы, причем очень краткие, каждый раз "гулять" по всем нодам , вести реестр аттрибутов и значений и сравнивать текущее с реестром.
И сдается мне будет экстремально тормозным на реальных страницах с контентом. Это жесть. Проще написать функцию которая будет "оповещать" об вставке в dom нового объекта или изменении аттрибута. Но тогда ее надо будет воткнуть во все скрипты после всех строк которые меняют dom, отчего вероятно они распухнут как винни пух |
Цитата:
|
krasovsky,
да нет, можно просто подменить (HTML)Element.prototype.appendChild итд.=) Но не нужно конечно. |
| Часовой пояс GMT +3, время: 03:31. |