textNode addEventListener

Question

Почему я не могу добавить прослушиватель событий к самому текстовому узлу вместо элемента p?

<p>childNode</p>
...
p.childNodes[0].addEventListener('click',function(){alert('ok')},false)

Когда я нажимаю на childNode, в chrome ничего не происходит

Answer 1

Текстовые узлы просто не запускают большинство событий: исторически, элементы несут ответственность за это в HTML DOM. Однако текстовые узлы запускают некоторые события (кроме IE <= 8): <a href="http://www.w3.org/TR/DOM-Level-3-Events/#events-mutationevents" rel="noreferrer"> События мутации DOM . Особенно полезным для текстовых узлов является DOMCharacterDataModified, который используется для обнаружения изменений в текстовом узле и может быть полезен в браузерных редакторах.

Пример: http://www.jsfiddle.net/timdown/c6dHX/

HTML:

<div contenteditable="true" id="div">A text node, edit me</div>

JavaScript:

var textNode = document.getElementById("div").firstChild;

textNode.addEventListener("DOMCharacterDataModified", function(evt) {
    alert("Text changed from '" + evt.prevValue + "' to '" + evt.newValue + "'");
}, false);

Answer 2

Текстовые узлы - это просто простые экземпляры Node, и в соответствии со спецификациями DOM у них просто не может быть прослушивателей событий.Это не то, что нарушает естественный закон, но это не то, как работает DOM.