JSFiddle - React, Tailwind, and code Playground

by Владимир

HTML

<table border="1">
  <tr>
    <td class="a1">1</td>
    <td>2</td>
    <td class="a1">3</td>
  </tr>
  <tr>
    <td class="b2">4</td>
    <td class="b2">5</td>
    <td class="b2">6</td>
  </tr>
</table>

CSS

td {
width: 10%;
height: 10%;
background: rgba(150, 200, 255, 0.5);
}
.a1 {
background: rgba(150, 255, 200, 1);
}
.b2 {
background: rgba(255, 150, 200, 1);
}

JavaScript

(function(){
	let tds = document.querySelectorAll('td.a1, td.a3')
  let tds_length = tds.length
  console.log(tds.length)
  for(let i = 0; i < tds_length; i++){
  	tds[i].addEventListener('click', copyFanc)
  }
  
  function copyFanc(event){
  	let element = event.target || event.srcElement;
    let text = element.innerText
    navigator.clipboard.writeText(text).then(function() {
      console.log('Текст скопирован!')
    }, function(err) {
      console.error('Ошибка копирования: ', err)
    });
  }
})()