MutationRecord#
MutationRecord.target#
Właściwość target
zwraca cel obserwacji (węzeł), dla którego dany zapis zmian został utworzony. Właściwość jest tylko do odczytu.
Opis działania#
Samo wywołanie i poszczególne jego części najlepiej objaśnić na zapisie składniowym:
var record_target = mutationRecord.target;
gdzie poszczególne człony oznaczają:
- record_target - referencja do węzła, dla którego zmiany zostały zapisane. Jego rodzaj jest silnie uzależniony od typu zmiany:
- "
attributes
" - celem jest element, którego atrybuty uległy zmianie. - "
characterData
" - celem jest węzeł znakowy, którego dane tekstowe uległy zmianie. - "
childList
" - celem jest węzeł, którego lista dzieci uległa zmianie (np. ich liczba).
- "
- mutationRecord - zapis zmian będący obiektem kontekstu.
Zwracam uwagę, że celu obserwacji nie należy mylić z węzłem, na którym obserwator zmian został zarejestrowany za pomocą metody MutationObserver.observe()
. Zazwyczaj będziemy mieli do czynienia z tym samym węzłem, ale jeśli przy rejestrowaniu obserwatora zmian ustawimy właściwość subtree
w słowniku typu MutationObserverInit
na boolowską wartość true
, to zgodności prawdopodobnie nie będzie.
Prosty przykład:
<script>
// Tworzymy nowego obserwatora 'newObserver'
var newObserver = new MutationObserver(function(records, observer){
// W czasie wywołania funkcji zwrotnej mamy dostęp do:
// records - lista ze wszystkimi obiektami MutationRecord
// observer - nasz newObserwer
document.documentElement.innerHTML += "<br><br>" + "Zarejestrowano zmiany węzła HTML"
+ "<br>" + "Liczba zmian records.length: " + records.length
+ "<br><br>" + "Interfejs pierwszej zmiany records[0]: " + records[0]
+ "<br>" + "Cel pierwszej zmiany records[0].target: " + records[0].target;
observer.disconnect(); // wyłączamy obserwatora (zabezpieczenie przed nieskończonym wywoływaniem)
});
// Tworzymy obiekt konfiguracyjny
var config = {
attributes: true,
childList: true,
characterData: true,
attributeFilter: ["id", "name"]
};
// Rejestrujemy 'newObserver' na konkretnym węźle (HTML),
// przekazując jednocześnie obiekt konfiguracyjny 'config'.
newObserver.observe(document.documentElement, config);
document.write(newObserver); // [object MutationObserver]
</script>
Właściwość target
pojawia się dopiero w specyfikacji DOM4.
Składnia Web IDL#
interface MutationRecord { [SameObject] readonly attribute Node target; }
Specyfikacje i inne materiały#
Pasek społecznościowy