Beispiel:JS-event-currentTarget.html

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

<!DOCTYPE html> <html lang="de"> <head>

 <meta charset="utf-8" />
 <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 <link rel="stylesheet" media="screen" href="./Beispiel:SELFHTML-Beispiel-Grundlayout.css" />
 <style>
   div {
     width: 20em;
     height: 10em;
     float: right;
     background-color: #fffbf0; 
     border: 2px dotted #e7c157; 
   }
   #ereignis {
     color: #c32e04;
     font-weight: bold;
     padding: .2em 1em;
     background-color: #fffbf0;
     border: 2px dotted #e7c157;
   }
 </style>
 <title>Beispiel: event.currentTarget</title>
 <script async>
   'use strict';
   document.addEventListener('DOMContentLoaded', function () {
     function findeAuslöser(event) { 
       var elem = event.currentTarget,
           name = elem.nodeName;	  
       document.getElementById('ereignis').textContent = name;
     }
     var seite = document.documentElement;
     seite.addEventListener('click',findeAuslöser);	
   });
 </script>

</head> <body>

Beispiel: event.currentTarget

 <main>

Überschrift

Klicken Sie irgendwo auf die Seite. Es wird dann angezeigt, für welches Element der Eventhandler registiert ist.

  • Pizza
  • Pasta
  • Prosciutto
  1. Pizza
  2. Pasta
  3. Prosciutto

Eventhander für - registriert.

 </main>

</body> </html>