Wieso sollen JavaScript-Eventhandler nicht im HTML-Code stehen?

[dedlfix]

Tach!

Was ist der Vorteil, Eventhandler erst nach dem Laden der Seite per JavaScript hinzuzufügen, anstatt direkt "onload" usw. im HTML-Code zu haben?

Mit "Trennung von Zuständigkeiten" kann man diese Vorgehensweise kurz umschreiben. Man hat alles beisammen an einem Ort und nicht überall verteilt.

Ein Browser, der kein JavaScript ausführt, stört sich nicht an diesen Attributen. Alle anderen können sofort den fertigen DOM-Tree aufbauen, ohne dass hinterher noch einmal mit JavaScript drübergegangen werden muss, um überall die passenden Handler anzuflanschen.

Ob gleich oder hinterher nimmt sich ja nicht viel, es muss in beiden Fällen getan werden. Lediglich der Teil "Suchen des Elements" fällt weg, und den haben die Browserhersteller hoffentlich gescheit optimiert.

Letzteres ist zudem fehlerträchtig, etwa wenn man sich mal in der ID eines Elementes vertippt oder wenn bei Änderungen im HTML-Code übersehen wird, die externe .JS-Datei auch anzupassen usw.

Ja, aber solche Fehler können auch abseits der Eventhandler auftreten. Du möchtest dich ja vielleicht im Eventhandler auf andere Elemente beziehen, und auch da muss der Name (oder allgemein der Selektor) passen. Aufpassen musst du bei Änderungen also immer. Da kann solch ein Ruhekissen auch negative Auswirkungen haben.

Besser ist es also IMHO, wenn alles, was zu einem HTML-Element gehört, auch direkt dabei steht und nicht im Nachhinein von fernem Code unerwartet manipuliert wird.

Aber dann auch bitte konsequent mit CSS. Wenn Elemente einen individuellen Style bekommen sollen, dann schreib ihn zu jedem Element einzeln in die style-Angabe. - Nicht! - Bei dieser Argumentation solltest du sehen, dass es zumindest ab einem bestimmten Punkt nicht mehr sinnvoll ist, eine individuelle Konfiguration statt einer zentralisierten zu haben. Bei den Eventhandlern, die ein Single-Leben führen, mag man das ja noch vertreten können. Generell werden da wohl vorwiegend Konsistenzgründe genannt werden. Wenn wir schon überall trennen, können wir das an der Stelle auch durchziehen.

Es gibt aber auch noch ein paar technische Gründe, beispielsweise, dass man an das Element mit HTML nur einen Eventhandler anbringen kann, mit Javascript aber beliebig viele. Und einige Ereignisse haben gleich gar keinen Ansatzpunkt im HTML.

dedlfix.