в чем разница между 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/

Попробуйте удалить контейнер, когда текстовый узел все еще там и вставить его обратно, чтобы увидеть различные события, вызванные.


вот две статьи, о которых вы можете прочитать

  1. событие DOMNodeInsertedIntoDocument
  2. DOMNodeInserted событие

например, вы можете вставить Node на BOM элемент для разработки расширения браузера или управления историей.

т. е. BOM состоит из навигатора объектов, истории, экрана, местоположения и документа, которые являются дочерними элементами окна . В узлом документа является DOM, объектная модель документа, которая представляет содержимое страницы. Вы можете управлять им с помощью javascript.(Из Вики)

вот фрагмент, чтобы помочь, если вы хотите продолжать учиться.

$(window).on('DOMNodeInsertedIntoDocument', function(){
  console.log('DOMNodeInsertedIntoDocument occurred');
});

$(window).on('DOMNodeInserted', function(){
  console.log('DOMNodeInserted occurred');
});

кстати, просто для информации. mutationobserver'а замена Событий Мутации.


Они не одинаковы, потому что первый должен также срабатывать при добавлении нового узла к узлу, который находится вне документа (создан и еще не добавлен или ранее удален из его родителя).