в чем разница между DOMNodeInserted и DOMNodeInsertedIntoDocument?
согласно событиям DOM в wiki найдено в ссылке wiki здесь,
DOMNodeInserted: срабатывает, когда узел был добавлен как дочерний узел другого узла
DOMNodeInsertedIntoDocument: срабатывает, когда узел вставляется в документ
теперь какова реальная разница? Разве оба события не должны быть одинаковыми? Если нет, то когда и где следует использовать?
сценарий, в котором я использую вышеупомянутые события DOM, заключается в том, что я есть набор страниц и каждая страница загружается навигация.JSP-файл внутри div, зарезервированного для навигации. Теперь я хочу выделить вкладку nav текущей страницы, поэтому я даю ей небольшое фоновое свойство после загрузки элемента DOM ( nav DIV).
теперь для моей проблемы
$(document).on('DOMNodeInserted', function(e) {
if(e.target.id=="navigate"){
//...........
}
});
работал, но просто любопытно, в чем разница между двумя событиями, указанными в моем вопросе.
3 ответов
на DOMNodeInsertedIntoDocument
событие аналогично DOMNodeInserted
событие, но оно происходит, когда узел вставляется в документ.
например, если узел добавляется к элементу, который не является частью документа DOMNodeInserted
событие запускается, но DOMNodeInsertedIntoDocument
событие не является. Если родительский элемент узла вставлен в документ, то DOMNodeInsertedIntoDocument
событие запускается, но DOMNodeInserted
событие не является.
См. JSFiddle: http://jsfiddle.net/ghyga4v6/2/
Попробуйте удалить контейнер, когда текстовый узел все еще там и вставить его обратно, чтобы увидеть различные события, вызванные.
вот две статьи, о которых вы можете прочитать
например, вы можете вставить Node
на BOM элемент для разработки расширения браузера или управления историей.
т. е. BOM состоит из навигатора объектов, истории, экрана, местоположения и документа, которые являются дочерними элементами окна . В узлом документа является DOM, объектная модель документа, которая представляет содержимое страницы. Вы можете управлять им с помощью javascript.(Из Вики)
вот фрагмент, чтобы помочь, если вы хотите продолжать учиться.
$(window).on('DOMNodeInsertedIntoDocument', function(){
console.log('DOMNodeInsertedIntoDocument occurred');
});
$(window).on('DOMNodeInserted', function(){
console.log('DOMNodeInserted occurred');
});
кстати, просто для информации. mutationobserver'а замена Событий Мутации.
Они не одинаковы, потому что первый должен также срабатывать при добавлении нового узла к узлу, который находится вне документа (создан и еще не добавлен или ранее удален из его родителя).