Liebe Community,
ich möchte einen DOM Listener erstellen. Dieser soll, sobald eine Fehlermeldung auf der Seite erscheint, ein bestimmtes Event senden:
<script>
var contentDiv = document.querySelector("#contents");
var MutationObserver = window.MutationObserver 
window.WebKitMutationObserver;
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
if(mutation.type==="childList" && mutation.addedNodes[0].className==="error") {
dataLayer.push({'event': 'newErrorSpan', 'spanErrorMessage': mutation.addedNodes[0].innerHTML});
observer.disconnect();
}
});
});
var config = { attributes: true, childList: true, characterData: true }
observer.observe(contentDiv, config);
</script>
Leider scheitere ich bereits bei dem querySelector.
Ich möchte per
document.querySelector("offers-table__cell offers-table__cell--traveldate")
folgende HTML Klasse abrufen und mit
if(mutation.type==="childList" && mutation.addedNodes[0].className==="offers-table__error")
auf das Child Node Referenzieren.
<div class="offers-table__cell offers-table__cell--traveldate">
07.03.2016 -
<input type="hidden" name="_booking[selectedOffer][travelStart]" value="2016-03-07">
23.03.2016
<input type="hidden" name="_booking[selectedOffer][travelEnd]" value="2016-03-23"><br>
(16 Nächte)
<input type="hidden" name="tx_tourvitalibe_booking[selectedOffer][duration]" value="16"><br>
<div class="offers-table__error">Ein Fehler ist aufgetreten! Bitte überprüfen Sie Ihre Angaben oder Versuchen Sie ein anderes Angebot!</div></div>
Die Klasse des Child-Nodes kann ich per querySelector abrufen, doch document.querySelector("offers-table__cell offers-table__cell--traveldate") funktioniert nicht.
Könnte mir jemand bei dieser Angelegenheit weiter helfen?
Vielen Dank!
Stefan