В настоящее время я использую FireFox + веб-компонент Polyfill. Веб-компонент изменяется, когда вызовы AJAX предоставляют разные наборы данных (по сути, это форма поиска, которая содержит ссылки на связанные темы). Однако я пытаюсь написать некоторый JavaScript, который будет запрашивать результаты AJAX, когда они отображаются в ShadowDOM.
Моя проблема заключается в том, что при выполнении запроса, если старый набор данных больше новых результатов, я получаю новые результаты + оставшуюся длину элементов из старого поиска.
Например (элементы списка узлов упрощены для иллюстрации):
Search1: "Teenage Mutant Ninja Turtles"
Resulting NodeList: ['Teenage', 'Mutant', 'Ninja', 'Turtles']
Продолжите поиск с помощью другого поиска ...
Search2: "Inspector Gadget"
Resulting NodeList: ['Inspector', 'Gadget', 'Ninja', 'Turtles']
Search3: "Warner Brother's Tiny Toon Adventures"
Resulting NodeList: ['Warner', 'Brother\'s', 'Tiny', 'Toon', 'Adventures']
Search4: "Freakazoid"
Resulting NodeList: ['Freakazoid', 'Brother\'s', 'Tiny', 'Toon', 'Adventures']
Мой код запроса выглядит так:
var nodes = document.querySelector('search-component').shadowRoot.querySelectorAll('div.result');
Есть ли способ запросить список заполненных узлов веб-компонентов и получить только те элементы DOM, которые существуют в текущий момент времени (не учитывая предыдущие элементы, которые могли существовать)?