0

要素のグループを観察しようとしています。要素の数は、1 から 10 までさまざまです。

$observedElements = document.querySelectorAll('em.price'); 
// in that time length will be 3.

// $observedElements[0]  is a   '<em class='price'>10.15</em>'
// $observedElements[1]  is a   '<em class='price'>35.00</em>'
// $observedElements[2]  is a   '<em class='price'>48.95</em>'

そう..

var observer = new MutationObserver(function(MutationRecord) {
    MutationRecord.forEach(function(MutationRecord) {
        if (MutationRecord.type == 'characterData')  {  
            console.log ('got it ... in elem. № ? ');   
            // which element is affected by this mutation? [0], [1] or [2] ?    
        };
    });
});

var observerConfig = { attributes: false, childList: true, characterData: true, subtree: true, };

for (var i = 0; i < $observedElements.length; i++) {
    observer.observe($observedElements[i], observerConfig);
};

いずれかの要素の値が変更された場合、MutationRecord.type characterData を受け取ります。私の例では、$observedElements[1] が '35.00' から '25.00' に変わります。

しかし、この変更が優れた $observedElements[1] にあったことをどのように知ることができますか? 受信した target.textContent には、テキスト値のみが含まれています。

4

1 に答える 1