Как остановить пузыриться на событии DOMSubtreeModified?

Question

У меня довольно простой сценарий.У меня есть следующий HTML:

<h1>Hello</h1>
<input type="button" value="Change" id="change" />

С соответствующим JS:

var h1 = $("h1").get(0);

h1.addEventListener("DOMSubtreeModified", function(ev) {

    console.log("Changed");

    ev.bubbles = false;
    ev.cancelBubble = true;
    ev.defaultPrevented = true;
    ev.preventDefault();
    ev.stopPropagation();
    ev.returnValue = false;

    return false;

}, false);

$("#change").click(function() {
    $("h1").text("World");
});

Итак, это в основном просто изменяет текст узла H1, и затем событие запускается.Тем не менее, событие запускается дважды (как я полагаю, в результате пузырей).Как вы можете видеть, я пытался бросить все, чтобы не выстрелить дважды, но это не останавливает.Если вы хотите поиграть с кодом, вы можете проверить его по адресу: http://jsfiddle.net/sECtq/. Любая помощь будет принята с благодарностью.Спасибо.

Answer 1

Это поведение не вызвано пузырьками.

$. Text () выполняет 2 шага, чтобы установить новый текст:

1. удалить существующее содержимое
2. вставить новый текстовый узел

Оба шага вызывают DOMSubtreeModified, поэтому вы получаете 2 оповещения.

Вы можете использовать, например, следующее:

$("h1")[0].firstChild.data="World";

Это изменит только содержимое textNode без удаления узла.

Answer 2

или вы также можете проверить, было ли распространение остановлено или нет.Взгляните на http://api.jquery.com/event.isPropagationStopped l