Вывод элемента по которому кликнули

05.10.2019 12:43:23 pm

#1

Есть блок на странице, представим его так <div class="region"></div>, внутри этого блока расположены другие элементы страницы. Как сделать, чтобы при клике на любой из этих элементов, вылетал alert с самим элементом?

Жалоба

05.10.2019 02:05:32 pm

#2

Например, блок с таким содержимым:

<div class="region">
  <table>
    <tr>
      <td>
        <div>Первый блок</div>
      </td>
      <td>
        <div>Второй блок</div>
      </td>
  </table>
</div>

Делаем так:

document.querySelector('.region').addEventListener('click', function(el) {
  alert(el.target.tagName);
});

Готово!

Возможно, будет интересно:
- Как получить атрибут элемента, на который кликнули (JavaScript)
- Как получить все "потомственные" блоки на jQuery

Жалоба

05.10.2019 03:09:01 pm

#3

Не плохо. Только, как сделать, чтобы вместо DIV выходило <div>Первый блок</div>?

Жалоба

05.10.2019 04:09:31 pm

#4

Замените tagName на outerHTML:

document.querySelector('.region').addEventListener('click', function(el) {
  alert(el.target.outerHTML);
});

outerHTML - служит для получения сериализованного HTML фрагмента.

Как [object HTMLTagElement] перевести в строку

Жалоба

05.10.2019 06:04:55 pm

#5

Спасибо! Вы и в правду волшебник!

Жалоба