1

Здравствуйте

Есть примерно такая разметка:

<div class="wrapper">
  <div>1</div>
  <div>2</div>
  <div>3</div>
  <div>4</div>
  <div>5</div>
  <div>6</div>
</div>

Помогите пожалуйста, как с помощью JS получить содержимое каждого блока при клике по нему?

2 ответа 2

4

Учите основы, пригодится.
События.
Делегирование.
Свойства нод.

document.querySelector('.wrapper').addEventListener('click', e => {
  // e.target - целевой элемент
  let content = e.target.innerHTML;
  
  console.info(`Содержимое элемента: "${content}"!`);
});
div{
  cursor: pointer;
}
<div class="wrapper">
  <div>1</div>
  <div>2</div>
  <div>3</div>
  <div>4</div>
  <div>5</div>
  <div>6</div>
</div>

0

Можно еще так:

div = document.querySelectorAll('.wrapper div');
output = document.querySelector('output');
  
  div.forEach(get);
  
  function get(e){
  	e.addEventListener('click', function(){
    	output.innerHTML = 'Содержимое: ' + e.innerHTML;
    })
  }
<div class="wrapper">
  <div>1</div>
  <div>2</div>
  <div>3</div>
  <div>4</div>
  <div>5</div>
  <div>6</div>
</div>
<output></output>

1
  • Никогда не видел тега output, что за тег такой?
    – ΝNL993
    21 июл 2022 в 18:06

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.