Chcę wstrzyknąć na stronę fragment kodu za pomocą JS. Normalnie nie stanowi to problemu, bo zrobiłbym to addEventListener z eventem DOMContentLoaded
i mogę dowolnie modyfikować kod. Problem pojawia się gdy część kodu, którą chcę podmienić jest generowana później, np. poprzez AJAX. Wówczas DOMContentLoaded nie ma zastosowania. Fragment kodu wygląda następująco:
document.addEventListener("click", function(event){
document.querySelector("h1").insertAdjacentHTML('afterend', '<div>asd</div>');
});
Całość kodu można przetestować tutaj: https://www.w3schools.com/js/tryit.asp?filename=tryjs_ajax_first trzeba tylko dodać powyższy kod. Kod działa z takimi eventami jak powyższy click
czy mouseover
, ale chciałbym by działało to od razu po załadowaniu danych.
Wiem, że można uzyskać taki efekt za pomocą MutationObserver, ale kompletnie nie wiem jak to zastosować praktycznie w tym kodzie, prosiłbym o jakieś wskazówki.