В чем разница между документом и DOM?

Question

Так я наткнулся на кусок о разнице между затруднительное JQuery (в) и жить() - http://msdn.microsoft.com/en-gb/scriptjunkie/ee730275.aspx - (Живи и дай умереть раздел)

Функция привязки регистрирует обработчики событий с реальными элементами DOM, что были выбраны, но функция live регистрирует обработчики событий в документе.

Я использовал обе эти функции, так что я получить разницу на практике, т.е. .live ('щелчок', функция() {..}); будет срабатывать на узле, внедренном JS, тогда как эквивалент связывания не будет.

Что я не знаю о взаимоотношениях/различиях между документом и DOM. Может ли кто-нибудь просветить меня, пожалуйста?

Спасибо, Denis

Answer 1

«Документ», на который вы ссылаетесь, является переменным браузером window.document, открытым в JavaScript, и является корневым узлом DOM. Помните, что DOM, как и ваш HTML-документ, является иерархией элементов.

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

При подключении к событию click на документе вы можете увидеть все события click для всех элементов, поскольку все они проходят через корневой узел, документ. Затем jQuery фильтрует то, что вам нужно, на основе вашего селектора.

Если вы просто используете bind, вы подключаетесь к событиям для данных элементов, которые существуют в данный момент времени. Если позже вы добавите новые элементы на страницу, у них не будет привязки к ним.

Answer 2

Это не разница между документом и DOM. Это разница между объектом документа и отдельными объектами объекта DOM. Функция live следит за всеми событиями в документе, и если объект, который вызвал событие, соответствует селектору, он вызовет обработчик. С другой стороны, функция bind наблюдает за событиями, вызванными определенным объектом элемента (обработчик привязан к этому конкретному объекту). Если вы удалите и заново создадите элемент, это будет другой объект и не будет прикреплен обработчик события. Это означает, что вы должны знать, что объект находится во время запуска bind.