点击表格行内按钮获取同前行前一列单元格值的问题求助

你的代码无法正常运行的原因有两个：

1. btn.previousSibling会选中按钮旁边的空白文本节点（HTML中的换行、空格会被解析为文本节点），而非你需要的表格单元格。
2. 按钮嵌套在<div>内，它的同级元素是另一按钮和空白节点，并非目标表格单元格，所以直接从按钮节点向上找是错误的。

以下是两种可行的修正方案：

方案一：通过行定位目标单元格（适合列位置固定的场景） #

function addArticle(btn) {
    // 找到按钮所在的表格行
    const row = btn.closest('tr');
    // 获取该行的Quantity列单元格（索引从0开始，第三列对应索引2）
    const quantityCell = row.querySelectorAll('td')[2];
    // 获取单元格文本并去除首尾空格
    const quantityValue = quantityCell.textContent.trim();
    alert(quantityValue);
}

方案二：通过当前单元格找前一列（更灵活，不受列位置变化影响） #

function addArticle(btn) {
    // 找到按钮所在的<td>单元格
    const currentTd = btn.closest('td');
    // 获取该单元格的前一个兄弟单元格（即Quantity列）
    const quantityCell = currentTd.previousElementSibling;
    const quantityValue = quantityCell.textContent.trim();
    alert(quantityValue);
}

关键知识点说明 #

• closest(selector)：从当前元素向上查找，返回匹配选择器的最近祖先元素，这里用来快速定位到行或按钮所在的单元格。
• previousElementSibling：专门获取前一个元素节点，会自动忽略空白文本节点，这是替代previousSibling的正确选择。

内容的提问来源于stack exchange，提问作者user3309231