Как повесить событие на элемент, которого еще нет?

Question

[novichkovv]

Простой вопрос, но ничего не могу уже два часа почему-то нагуглить:
Как на чистом javascript выглядит конструкция типа

$('body').on('click', '.selector', function() {...});

?

Answer 1

[gleendo]

document.addEventListener("click", event => {
  if (event.target.matches(".selector")) {
    // some code
  }
}, false);

Comments

[Денис]

У вас не делегированная обработка события

Answer 2

[Денис]

document.addEventListener('click', function(e){
	if(e.target.classList.contains('selector')) {
    	// Do something
    }	 
});

Comments

[gleendo]

Денис У вас обработка только селектора класса

[novichkovv]

Да, только селектор класса, но принцип понятен

[Денис]

novichkovv, просто iamevg_ решил, что лучшая защита - это нападение ;)

[novichkovv]

А вот поинтересней вопрос, в DOM через ajax встраивается

<div class="selector">
    <a href="...">...</a>
    <a href="...">...</a>
</div>

Как повесить onclick на эти ссылки до встаивания элемента?

[Денис]

novichkovv, а вот тут можете принимать ответ iamevg_, т.к. после исправления своего первого варианта, он вам вполне подойдет

Answer 3

[novichkovv]

Вот такой вариант подошел

document.addEventListener("click", function(event) {
         if(event.target.matches('a') && null !== event.target.closest('.selector')) {
             //Do some code here
         }
}, false);