Как кликать на вложенные элементы так чтобы не кликался родительский элемент?

Для того, чтобы кликать на вложенные элементы в JavaScript без того, чтобы срабатывал обработчик клика на родительском элементе, можно воспользоваться так называемым "event bubbling" или "всплытием событий".

По умолчанию, когда возникает событие (например, клик мышью), оно сначала обрабатывается на самом вложенном элементе, затем поднимается по иерархии DOM-элементов, вызывая обработчики событий для каждого из них (включая родительские элементы), это и есть "всплытие события".

Для предотвращения всплытия события к родительским элементам, можно использовать метод stopPropagation(). Вот пример:

document.getElementById('вложенныйЭлемент').addEventListener('click', function(event) {
  event.stopPropagation(); // Предотвращаем всплытие события
  // Тут ваша обработка клика на вложенном элементе
});

Таким образом, при клике на вложенный элемент будет выполнена только обработка этого элемента без распространения события на родительские элементы.

Это полезный прием, когда вам необходимо обрабатывать клики на конкретных вложенных элементах и избегать неожиданных действий на родительских элементах.