JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://clipboardjs.com/dist/clipboard.min.js"></script>
<div>
<table>
<tr>
<th>1</th>
<th>2</th>
<th>3</th>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
<tr>
<td>7</td>
<td>8</td>
<td>9</td>
</tr>
</table>
<div class="copy">Копировать</div>
</div>
<hr>
<div>
<table>
<tr>
<th>а</th>
<th>б</th>
<th>в</th>
</tr>
<tr>
<td>г</td>
<td>д</td>
<td>е</td>
</tr>
<tr>
<td>ё</td>
<td>ж</td>
<td>з</td>
</tr>
</table>
<div class="copy">Копировать</div>
</div>
CSS
table{
border-collapse: collapse;
border-spacing: 0;
}
th,td{
border: 1px solid #ccc;
padding: 2px 7px;
}
.copy{
margin-top: 10px;
border: 1px solid #ccc;
display: inline-block;
padding: 2px 7px;
background: #fafafa;
cursor: pointer;
}
JavaScript
new Clipboard('.copy', {
text: function(trigger) {
return trigger.parentNode.querySelector('table').outerHTML
}
})