Форум

JIEXA · #1 (**permalink**) 24.09.2011, 16:54

Скорее всего из серии нереального, но вдруг.

Скажите, есть ли какая-нибудь возможность поставить на body обработчик любых изменений содержания? Объяснить сложно, покажу на псевдокоде, с использованием jquery.

<html>
<body>
<div id="content"></div>
</body>
</html>

$(document).ready(function(){
   $('body').change(function(){
     console.log('содержание body или дочерних элементов изменилось');
   });

   // Изменяем body, чтобы вызвалось change
  $('body').append('text');
  
  // Изменяем дочерний элемент, чтобы опять же вызвалось change
  $('#content').html('text'); 
});

Понятное дело, что такой код не будет работать.
Но возможно ли реализовать что-то подобное?

melky · #2 (**permalink**) 24.09.2011, 17:14

document.body.__defineSetter__("innerHTML", function(){
     alert("изменение страницы detected");
});

вообще, существует определенное событие изменения структуры страницы. Тип этих событий называется Mutation

И включает в себя такие события

DOMSubtreeModified
DOMNodeInserted
DOMNodeRemoved
DOMNodeRemovedFromDocument
DOMNodeInsertedIntoDocument
DOMAttrModified
DOMCharacterDataModified

События не отменяются (т.е. нельзя отменить действие по-молчанию, как, например, отправка формы).

Они всплывают (за исключением DOMNodeRemovedFromDocument и DOMNodeInsertedIntoDocument )

Обработчику события передается ивэнт (очевидно. как и обычно при клике).

Что содержит этот ивэнт - можно почитать в документации

НО! пока это не работает.. т.е. проследить за изменением страницы посредством этих событий нельзя - не реализовано ещё.

Но я попробую

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

Событие DOMNodeInserted отлично подойдёт - ведь добавляемый по клику текст является элементом TextNode. А оно идёт от NODE. т.е. будет встявляться узел при клике.

<button onclick="document.body.innerHTML+='<br>Clicked'">click</button>

<script>
document.body.addEventListener("DOMNodeInserted",function(e){ alert('страница изменена'); },false);
</script>

неколько алертов возникают из-за всплытия, наверное

PS ни-я. оно работает О_О. Ch14

Форум

Справочник

Discord чат

Курсы javascript