Domanda perché ottengo TypeError: obj.addEventListener non è una funzione?


Ecco il mio codice:

function addEvent( obj, type, fn ) {
  if ( obj.attachEvent ) {
    obj['e'+type+fn] = fn;
    obj[type+fn] = function(){obj['e'+type+fn]( window.event );}
    obj.attachEvent( 'on'+type, obj[type+fn] );
  } else
    obj.addEventListener(type, fn, false);
}

function alertWinner(){
    alert("You may be a winner!");
}

function showWinner (){
    var aTag = document.getElementsByTagName("a");
    addEvent(aTag, 'click', alertWinner);
}

showWinner();

Fondamentalmente, sto lavorando alla console di Firebug e sto cercando di ottenere un avviso da far apparire quando viene cliccato un tag.

Non riesco a vedere il problema che risulta in questo non funziona e dandomi l'errore indicato nel titolo delle mie domande (visualizzato in firebug). Chiunque?


20
2018-03-18 19:16


origine


risposte:


document.getElementsByTagName restituisce a NodeList di elementi DOM. Ogni elemento ha un addEventListener funzione, ma l'array non ne ha uno.

Passa sopra:

function showWinner (){
    var aTags = document.getElementsByTagName("a");
    for (var i=0;i<aTags.length;i++){
        addEvent(aTags[i], 'click', alertWinner);
    }
}

35
2018-03-18 19:18



aTag è un'istanza di DOMNodeList, non da DOMElement.

Potresti farlo invece:

var aTags = document.getElementsByTagName("a");
var aTag = aTags[0];

Ma ovviamente questo approccio presenta un difetto, in quanto potrebbero essercene più di uno a elemento restituito. Dovresti utilizzare un altro selettore che restituisce solo un elemento, se possibile.


7
2018-03-18 19:18



Non so perché, ma ho capito addEvent is not defined in Firefox. Non riuscivo nemmeno a trovarlo addEvent() su MDN. Ho dovuto usare questo:

function showWinner (){
    var aTags = document.getElementsByTagName("a");
    for (var i=0;i<aTags.length;i++){
        // addEvent(aTags[i], 'click', alertWinner);
        aTags[i].addEventListener("click", alertWinner);
    }
}

4
2018-05-25 04:37