Получение значения из ячейки html кликом по ячейке

Question

Как можно получить данные из ячейки таблицы в буфер обмена, просто нажав на неё?

Таблица статичная.

Answer 1

Используйте событие клик и берите значение из event target:

let table = document.querySelector('table');
let output = document.querySelector('.output');

table.addEventListener('click', (e)=> {
if(e.target.nodeName =="TD") {
 copyToClipboard (e.target.innerText)
}

})
let copyToClipboard = (str) => {
  let area = document.createElement('textarea');

  document.body.appendChild(area);  
area.value = str;
area.select();
document.execCommand("copy");
alert(`Скопированное значение ${area.value}`)
  document.body.removeChild(area);  
}

td{
  border: 1px solid black
}

<table>
  <tr>
    <td>Один</td>
    <td>Два</td>
    <td>Три</td>
  </tr>
  <tr>
    <td>123</td>
    <td>4413</td>
    <td>5мчс</td>
  </tr>
  <tr>
    <td>аыв</td>
    <td>234234</td>
    <td>ииячис</td>
  </tr>
</table>
<div class="output"></div>

БЛОГ НА HUSL

Получение значения из ячейки html кликом по ячейке

Ответы (1 шт):