从任何表复制行

Question

我有一个HTML页面，上面有3个表。我希望能够将表行中的特定单元格复制到剪贴板。该行可以来自3张表中的任何一张。

使用下面的代码，我高亮显示并复制ID为"0"的表的行；最终"；。我如何使这3张表中的任何一张都适用？我试着用getElementsByTagName给它们贴上相同的名字，但没有成功——这是可以理解的。有办法指定所选的表吗？我试图避免复制整行，最终可能会将格式化的消息添加到新页面，而不是复制到剪贴板。

function copy_highlight_row() {
var table = document.getElementById('final');
var cells = table.getElementsByTagName('td');
for (var i = 0; i < cells.length; i++) {
// Take each cell
var cell = cells[i];
// do something on onclick event for cell
cell.onclick = function () {
// Get the row id where the cell exists

var rowId = this.parentNode.rowIndex;
var rowsNotSelected = table.getElementsByTagName('tr');
for (var row = 0; row < rowsNotSelected.length; row++) {
rowsNotSelected[row].style.backgroundColor = "";
rowsNotSelected[row].classList.remove('selected');
}
var rowSelected = table.getElementsByTagName('tr')[rowId];
rowSelected.style.backgroundColor = "yellow";
rowSelected.className += " selected";
var cellId = this.cellIndex + 1
msg = 'Title: ' + rowSelected.cells[0].innerHTML;
msg += 'rnDescription: ' + rowSelected.cells[1].innerHTML;
msg += 'nnLink: ' + rowSelected.cells[2].innerHTML;
msg += 'nPublication Date: ' + rowSelected.cells[3].innerHTML;
//msg += 'nThe cell value is: ' + this.innerHTML copies cell selected
navigator.clipboard.writeText(msg);

}
}
};

Answer 1

基于几个建议，我提出了以下建议：

function highlight_row() {

var cells = document.querySelectorAll('td')
for (var i = 0; i < cells.length; i++) {
// Take each cell
var cell = cells[i];
// do something on onclick event for cell
cell.onclick = function () {
// Get the row id where the cell exists

var rowId = this.parentNode.rowIndex;
var t_ID = this.closest('table').id 
var table=document.getElementById(t_ID);
var rowsNotSelected = table.getElementsByTagName('tr');

for (var row = 0; row < rowsNotSelected.length; row++) {
rowsNotSelected[row].style.backgroundColor = "";
rowsNotSelected[row].classList.remove('selected');
}
var rowSelected = table.getElementsByTagName('tr')[rowId];
rowSelected.style.backgroundColor = "yellow";
rowSelected.className += " selected";
var cellId = this.cellIndex + 1
msg = 'Title: ' + rowSelected.cells[0].innerHTML;
msg += 'rnDescription: ' + rowSelected.cells[1].innerHTML;
msg += 'nnLink: ' + rowSelected.cells[2].innerHTML;
msg += 'nPublication Date: ' + rowSelected.cells[3].innerHTML;
navigator.clipboard.writeText(msg);             
}
}
}

在html的末尾，我调用函数。HTML包含3个表，这使我能够单击任何表，突出显示行，并复制正确的单元格范围。