JAVASCRIPT OLAY DİNLEYİCİ (ADDEVENTLISTENER) KULLANIMI

Selamlar..

Javascript ile bir olay için fonlksiyon yazmak istediğimizde , bunu html kısmında etiket içerisinde belirtebiliyoruz.  (onclick=".." vb). Ancak bu bazen kod karmaşasına sebep olabiliyor. Bunun yerine olay tetiklemelerini de  script bölümünde belirtmek daha derli toplu bir yazım elde etmemizi sağlayabilir. Bunun için elemanların addEventListener metodunu kullanabiliriz. 

Kullanım:

<script>
   addEventListener("click",function() { }  );
   // yada
   addEventListener("click",() => { }  );
</script>

Örneğin"mybtn" id'li bir butonun tıklama olayı için addEventListener ile  fonksiyon yazalım.

<button id="mybtn"> BUTON </button>

<script>
   document.getElementById("mybtn").addEventListener("click",function() {
      alert("TIKLANDI");
   });
</script>

Kod bloğuna göre buton tıklandığında "TIKLANDI" uyarısı alırız. Burada click olayı için olay dinleyici yazıldı ama  diğer olaylar içinde benzer şekilde bu  metod kullanılabilir.