dave: document.getElementById() und prototype

Hi,

Eventhandler hängt man im IE mit .attachEvent anstelle von .addEventListener an. Ich möchte das vereinheitlichen, so dass ich auch im IE .addEventListener schreiben kann.

Dazu wollte ich dem Prototypen eines Node-Objekts die entsprechende Funktion hinzufügen, so dass alle über document.getElementById/sByTagName/sByClassName angesprochenen Objekte diese Funktion haben.

Ein spezielles "Node-Objekt" gibt es scheinbar nicht, daher dachte ich ich hänge die Funktion einfach an Object an. Dann haben zwar auch Arrays und Zahlen usw. die Funktion was mich aber nicht stören würde.

Allerdings scheint das nicht zu funktionieren:

Object.prototype.addEventListener = function(){  
  alert("dummy");  
}  
document.getElementsByTagName('body').addEventListener();

Dieser Code führt im IE7 zu einer Fehlermeldung, dass "Das Objekt diese Methode nicht unterstützt".

Im IE9, Chrome und Fx7 wird das alert ausgegeben.
IE8 konnte ich nicht testen, IE9 als IE8 bringt den gleichen Fehler wie der IE7.

Warum funktioniert das nicht?

~dave

  1. Ich bin dumm

    Object.prototype.addEventListener = function(){

    alert("dummy");
    }
    document.getElementsByTagName('body').addEventListener();

      
    Da fehlt ein ; und ein [0], dann gehts in keinem von mir getesteten Browser:  
    ~~~javascript
    Object.prototype.addEventListener = function(){  
      alert("dummy");  
    };  
    document.getElementsByTagName('body')[0].addEventListener();
    

    Warum?
    Weiß jemand einen Weg wie ich den Elementen die ich über document.getElement* bekomme neuen Funktionen hinzufügen kann?

    ~dave

    1. Ich bin dumm

      stimmt

      Ein spezielles "Node-Objekt" gibt es scheinbar nicht

      doch, gibt es:

      Node.prototype.addEventListener = function(){  
        alert("dummy");  
      };  
      document.getElementsByTagName('body')[0].addEventListener();
      

      Funktioniert dann auch im Chrome und im IE9.
      Im Fx7 kann man addEventListener scheinbar nicht überschreiben, neue Funktionen kann man so aber auf jeden Fall anhängen.

      Nur der IE7 sagt er kennt kein Node-Objekt.

      Warum?

      (oder wartet einfach nochmal 15 Minuten, dann kommt das nächste Ingrid-Posting)

      ~dave

      1. geht scheinbar nicht.

        Fünf Minuten Forumssuche spart eine Stunde rumprobieren.

        ~dave

      2. Hallo,

        Nur der IE7 sagt er kennt kein Node-Objekt.

        Die Konstruktoren der DOM-Objekte und deren Prototypen bieten ältere IEs nicht an. Du kannst zwar Object.prototype erweitern, aber auf DOM-Elemente sind davon nicht betroffen. Das liegt daran, dass es eine Trennung zwischen DOM-Objekten und JScript-Objekten gibt. Das sind sozusagen zwei Welten. Die DOM-Objekte funktionieren nicht nach den Regeln der JScript-Objekte. DOM-Objekte haben keine constructor-Eigenschaft und ihre Identifier Resolution verläuft nicht entlang einer nachvollziehbaren Prototype-Chain. Mit IE 8 hat sich das ein wenig geändert. Es gibt aber immer noch eine Trennung zwischen ECMAScript/JScript und DOM. Erst mit IE 9 verhalten sich die DOM-Objekte wie echte ECMAScript-Objekte, zumindest was Konstruktoren und Prototypen angeht, welche nun zugänglich und erweiterbar sind.

        Was die Erweiterung von DOM-Objekten angeht, so gibt es drei Möglichkeiten:

        • Es nicht zu tun und Helferfunktionen wie addEvent in einer Bibliothek sammeln und die Elemente als Parameter übergeben.
        • Die einzelnen Elementobjekte zu kapseln und sie zu erweitern, wie PrototypeJS und Mootols es tun. Das ist aber keine gute Idee.
        • Wrapperobjekte zu schaffen, welche die browserübergreifenden Helferfunktionen anbieten. So macht es z.B. jQuery.

        Mathias

        1. Hi,

          Vielen Dank für diese Erklärung und Links.
          Hat sich der Thread für mich ja doch noch gelohnt: jetzt bin ich etwas schlauer.

          ~dave