Linuchs: Click-Event auswerten (stopPropagation)

Beitrag lesen

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:

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.

target=[SMALL] currentTarget=[TBODY]

Damit ist mir das Verfahren verständlich. Mich interessiert jedoch die Zeile TR, die ich farbig markieren möchte. Also kann ich das Klick-Event doch nicht so hoch in der Hirarchie ansetzen, sondern für jedes einzelne TR wie bisher?

Aber nehmen wir an, ich möchte das geklickte SMALL rot einfärben. Ah ja:

target.style.color = "#f00";

Linuchs