JavaScript не обнаруживает клики по тд

Question

JavaScript не обнаруживает клики по ячейкам таблицы, код не работает. Код:

document.querySelectorAll("td").forEach(e => e.addEventListener("click", function(){
    console.log(this.cellIndex);
    console.log(this.innerText);
    console.log(document.querySelectorAll("th")[this.cellIndex].innerText);
}));

Если я вставлю этот код в консоль, он будет работать, но как отдельный файл. js или в коде html он не будет работать. Что может быть не так?

Answer 1

Если вы связываете приведенный выше код в виде отдельных файлов JS, а теги импортируемых сценариев находятся в , убедитесь, что все функции, связанные с DOM, должны быть в DOMContentLoaded, или выполните обратный вызов события load.

Для этого экземпляра измените ваш скрипт во внешнем js файле на:

onload = () => {

    document.querySelectorAll("td").forEach(e => e.addEventListener("click", function(){
        console.log(this.cellIndex);
        console.log(this.innerText);
        console.log(document.querySelectorAll("th")[this.cellIndex].innerText);
    }));

}

edit 1:

Узнав, что он после Ajax,

Прежде всего, querySelectorAll возвращает NodeList, и у него нет метода forEach.

Используйте взамен Array.from (document.querySelectorAll ()). ForEach.

Во-вторых, поместите код в обратный вызов AJAX create td callback.