Мониторинг документа с помощью MutationObserver внутри функции - PullRequest
Новая
       27

Мониторинг документа с помощью MutationObserver внутри функции

0 голосов
/ 04 октября 2018

Фон

Я хочу пройтись по разбитой на страницы таблице Ajax и извлечь некоторые атрибуты src изображения, которые существуют до замены резервных изображений, и сохранить их в массиве.Хотя я могу легко отслеживать изменения атрибутов с помощью глобального MutationObserver, я хотел бы начать хранить их в целевом массиве только тогда, когда пользователь нажимает определенную кнопку.При щелчке я бы просматривал таблицу, сохранял мутированные атрибуты src в массиве, а затем прекращал сохранять после завершения процесса, чтобы пользователь мог свободно просматривать таблицу вручную без дальнейшей модификации массива.

Вопрос

Можно ли инициализировать MutationObserver внутри функции?Если так, что я делаю не так с примером игрушки ниже, который не возвращает массив объектов мутации, который я ожидал?Кажется, что cb никогда не вызывается. 

function test() {
    var a = [];
    colors = ['yellow', 'blue', 'red'];

    var cb = function(mutations, observer) {
        for (var mutation of mutations) {
            console.log('In mutations loop:', a);
            console.log(mutation);
            // Here I would pull out the img src attribute
            a.push(mutation);
        }
    };

    var observer = new MutationObserver(cb);

    observer.observe(document, {
        attributes: true, 
        attributeOldValue: true,
        childList: true, 
        subtree: true
    });

    for (var i=0; i < colors.length; i++) {
        // For my motivating problem this loop would click through
        // the table, triggering img src mutations.  
        console.log(colors[i]);
        document.body.style.cssText = 'background:' + colors[i] + ';';	
    }

    observer.disconnect();

    console.log('a:', a);
    return(a);
}

test()
...