Не работает MutationObserver

Question

Где я не прав?

<script type="text/javascript">


const observer = new MutationObserver(function (mutations) {
  mutations.forEach(function (mutation) {
    if (mutation.attributeName === 'class') {
      centerModal();
       console(loh);
    };
  });
});

const up = document.getElementsByClassName('uploaded-documents')[0];
observer.observe(up, {
  childList: true,
  attributes: true
});

function centerModal () {
    let paret = document.getElementsByClassName('upload__table')[0];
                   
    let d = document.createElement('div');
    d.innerHTML = '<iframe width="560" height="315" src="https://www.youtube.com/embed/70y94zG1-jU" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>'
        d.className='vid_verif';
        paret.appendChild(d);
        console(lgfoh);
}


</script>

Answer 1

Нужно, чтобы произошла мутация - изменение класса элемента .uploaded-documents. К консоли обращаются так - console.log(), аргумент log - либо выражение, либо строка.

document.getElementsByClassName('uploaded-documents')[0].addEventListener('click', ()=> {
  event.target.classList.add('mutate');
});

const observer = new MutationObserver(function (mutations) {
  mutations.forEach(function (mutation) {
    if (mutation.attributeName === 'class') {
      centerModal();
       console.log('check first');
    };
  });
});

const up = document.getElementsByClassName('uploaded-documents')[0];
observer.observe(up, {
  childList: true,
  attributes: true
});

function centerModal () {
    let paret = document.getElementsByClassName('upload__table')[0];
                   
    let d = document.createElement('div');
    d.innerHTML = '<iframe width="560" height="315" src="https://www.youtube.com/embed/70y94zG1-jU" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>'
        d.className='vid_verif';
        paret.appendChild(d);
        console.log('check');
}

.uploaded-documents {
  width: 100px;
  height: 100px;
  background: black;
}

<div class="uploaded-documents"></div>
<div class="upload__table"></div>

БЛОГ НА HUSL

Не работает MutationObserver

Ответы (1 шт):