Показать сообщение отдельно
  #1 (permalink)  
Старый 14.09.2018, 15:32
Аспирант
Отправить личное сообщение для Tipylja Посмотреть профиль Найти все сообщения от Tipylja
 
Регистрация: 17.04.2017
Сообщений: 72

MutationObserver - массив измененных элементов
Здравствуйте. Есть такая задача:
При изменении DOM дерева нужно вызывать функцию, в качестве аргумента которой, необходимо передать объект.
Объект должен содержать два поля:
Первое поле – строка, insert или remove в зависимости от того, что произошло с дом деревом, удалились ли из него элементы или добавились.
А второе поле, должно содержать массив удаленных или добавленных элементов и вот тут у меня затык. Если элемент был добавлен один, то у меня все выходит вот так



function observeChildNodes(where, fn) {
	var config = {
		childList: true,
		attributes: true,
		characterData: true,
		subtree: true,
		attributeOldValue: true,
		characterDataOldValue: true
	};

	var obj = {
		type: ""
		,nodes: []
	};
	var observer = new MutationObserver(function(mutations) {

		mutations.forEach(function(mutation) {
			obj.nodes = [];
			if(mutation.addedNodes.length > 0){
				obj.type = "insert";
				obj.nodes.push(mutation.addedNodes[0]);				
				
			}
			if(mutation.removedNodes.length > 0){
				obj.type = "remove";
				obj.nodes.push(mutation.removedNodes[0]);
			}

		});

		fn(obj);
	});


	observer.observe(where, config);
}

Но если добавлено или удалено несколько элементов, то не работает. Пробовал бегать в цикле по mutation.addedNodes[0] и mutation.removedNodes[0], но там масса информации, а не конкретные элементы.
Все это необходимо реализовать через MutationObserver.
Подскажите пожалуйста, как можно получить нужный мне массив внутри функции
Ответить с цитированием