Click-Event auswerten (stopPropagation)
bearbeitet von Linuchs> Statt für jedes einzelne Listenelement einen Eventhandler zu registrieren können wir nämlich auch einen Handler für das gemeinsame Elternelement registrieren, also für die Liste selbst.
Ich denke, meine Denkblockade war das Wort target = ZIEL, während ich nach der QUELLE gesucht habe, an der ein Klick ausgelöst wurde.
Habe ich nun sinngemäß gestestet für tbody:
~~~js
window.addEventListener('DOMContentLoaded', function ( ) {
var obj_tbody = document.getElementsByTagName( "tbody" );
for ( var i=0; i<obj_tbody.length; i++ ) {
obj_tbody[i].addEventListener('click', function (event) {
var target = event.target;
alert( "target=[" +target.tagName +"] currentTarget=[" +event.currentTarget.tagName +"]" );
});
}
...
~~~
Alert zeigt z.B.
~~~text
target=[SMALL] currentTarget=[TBODY]
~~~
Damit ist mir das Verfahren verständlich. Mich interessiert jedoch die Zeile TR, die ich farbig markieren möchte.
Aber nehmen wir an, ich möchte das geklickte SMALL rot einfärben. Ah ja:
~~~js
target.style.color = "#f00";
~~~
Linuchs