获取动态列的内容

Question

这是我的问题，我想通过“修改”按钮修改数据库，该按钮位于要修改的内容的列上。

<tr class ="xyz" id="5">
<td> sd</td>
<td> none</td>
</tr>

这是表格的第五列。 我想获取每个<td>中包含的文本，并将其发送给js函数，有没有办法做到这一点？

谢谢

Answer 1

具有此HTML结构：

<tr class ="xyz" id="5">
    <td> sd</td>
    <td> none</td>
</tr>

这是这样做的方法。

let tds = Array.from(document.getElementById('5').cells).map(function(elt)   {
    return elt.innerHTML;
}) // tds will now contains [' sd', 'none'];

Answer 2

您可以通过querySelectorAll选择ID为“ 5”的行中的所有tds，然后循环遍历它们。

let tds = document.querySelectorAll('[id="5"] td');

for (let i = 0; i < tds.length; i++) {
  console.log(tds[i].textContent);
}

<tr class ="xyz" id="5">
<td> sd</td>
<td> none</td>
</tr>

如果您使用以数字开头的ID或类名，则不能使用“＃”和“”。选择器。

Answer 3

您可以使用DOM来实现：

<table id="myTable">
    <tr id="5">
        <td>Row1 cell1</td>
        <td>Row1 cell2</td>
    </tr>    

var x = document.getElementById("myTable").rows.namedItem("5").cells;    
console.log(x[0].innerHTML);
console.log(x[1].innerHTML);

输出： output

然后您可以通过以下方式更改单元格的内容：

x[0].innerHTML = "new content";
x[1].innerHTML = "new content";