addEventListener co robię nie tak?

Question

function tabela(){
    var row = document.getElementById("myTr");
    row.src = "martwykaktoolodyga.png";
    var x = row.insertCell(-1);
    x.innerHTML = '<center><img src="martwykaktoolodyga.png" width="50px"></center>';
    x.addEventListener("onclick", function(x){
        alert("Cell index is: " + x.cellIndex);
    });

<table id="tabela">
 <tr id="myTr">                         
 </tr>
</table>

Czemu tworzącemu się <td> nie mogę przypisać tej funkcji? Gdy zrobię w html <td onclick="tutajFunkcjazAlertem(this)"> to wszystko działa, zapisuje w alercie numer z indexem, ale już w addEventListener nie, nic się nie wyświetla. Wpisuję w konsoli tę funkcję i pisze, że index jest niezdefiniowany.

Comments

zdarzenie nazywa się `click`, nie `onclick`.

---

'click' również nie działa, zmieniłem to na 'onclick' jak już pomysłu nie miałem.

Answer 1

Najpierw wczytać strukturę DOM, a dopiero później kod js. A poza tym obiektem właściwości cellIndex powinien być this.

Comments

"Najpierw wczytać strukturę DOM, a dopiero później kod js" W jaki sposób?

---

Z dokumentacji

https://developer.mozilla.org/pl/docs/DOM

---

 A poza tym obiektem właściwości cellIndex powinien być this.

(a jeszcze lepiej użyć event.target)

Answer 2

Domknij funkcje i ją wywołaj bo bez wywołania ten kod w ogóle się nie wykona.. No i zmień onclick na click i nie używaj center.. I img powinien mieć alt...

Przeanalizuj sobie prosty przykład.

Sprawdź czy nie masz jeszcze jakichś innych błędów w konsoli.

Answer 3

Znalazłem rozwiązanie, bardzo mi pomogliście.