Javascript 如何逐行获取html表值并对值执行一些计算？

如何逐行获取第一个表值，并在表2中以相同名称动态创建的行中显示这些值

我按行获取了第一个表值。我无法在表中按行显示这些值。在表2中，它显示了具有最后一行值的值，它不能在下一行中插入值，但可以覆盖第一行值

$（文档）.ready（函数（）{
$（“#tbUser”）。在（'click'，'btnDelete'，函数（）上{
var idx=$（this.closest（'tr'）.index（）；
$（“#tbUser”）.find（“tr”）.eq（idx）.remove（）；
$（“#tbUsers”）.find（“tr”）.eq（idx-1.remove（）；
});
$（“#tbUser”）。在（'click'，'btnAdd'，function（）上{
$（“#tbUser”）.append（“Pad0.000307v 2.2AddDelete”）；
$（“#tbUsers”）。追加（“”）；
$（“#tbUsers2”）。附加（“Pad”）；
$（“#tbUsers3”）。附加（“Pad”）；
});
});
$（'button'）。在（'click'，function（）上{
$（“tr.item”）。每个（函数（）{
var bottomholrate=$（this）.find（“输入[name='bottomholrate']”）val（），
CleanVolume=$（this.find）（“输入[name='CleanVolume']”）val（）；
bhc=$（this.find）（“input[name='BottomHoleConcentration']”）val（）；
Chemvol=$（this.find）（“输入[name='Chemvol']”）val（）；
//SlurryStageVolume=document.getElementById（'SlurryStageVolume'）。值；
Sluryrate=底孔酸盐；
搅拌器浓度=bhc；
ProppantAVG=document.getElementById（'selection'）.innerText；
支撑剂阶段质量=净体积*bhc；
pro_cum_质量=支撑剂_阶段_质量；
支撑剂体积=支撑剂阶段质量*支撑剂平均值；
pro_cum_vol=支撑剂_vol；
泥浆阶段体积=清洁体积*（1+支撑剂平均体积*bhc）；
泥浆体积=泥浆阶段体积；
清洁率=泥浆酸盐/（1+支撑剂AVG+bhc）；
阶段=泥浆\阶段\体积/泥浆酸盐；
支撑剂体积率=清洁率*bhc*支撑剂平均值；
支撑剂质量率=清洁率*bhc；
化学率1=化学体积*清洁率；
化学体积=化学体积*清洁体积；
document.getElementById（'StageTime'）。value=stage；
document.getElementById（'SlurryRate'）。value=SlurryRate；
document.getElementById（'CleanRate'）。value=CleanRate；
document.getElementById（'BlenderConcentration'）。值=BlenderConcentration；
document.getElementById（“支撑剂体积率”）。值=支撑剂体积率；
document.getElementById（“支撑剂质量率”）。值=支撑剂质量率；
document.getElementById（“支撑剂AVG”）。值=支撑剂AVG；
document.getElementById（“支撑剂阶段质量”）。值=支撑剂阶段质量；
document.getElementById（‘支撑剂累积量’）。value=pro_cum_vol；
document.getElementById（“支撑剂体积”）。值=支撑剂体积；
document.getElementById（‘支撑剂累积量’）。value=pro_cum_vol；
document.getElementById（'SlurryStageVolume'）。值=泥浆阶段体积；
document.getElementById（'SlurryCumulativeVolume'）。值=泥浆体积；
});
});

删除
添加
艺名
支撑剂选择
井底流速
净体积
井底浓度
品质
化学1卷/卷
表2
阶段时间（分钟）
泥浆速率
清洁率
搅拌机浓度
支撑剂体积率
支撑剂质量比
支撑剂平均值
支撑剂级质量
支撑剂累积质量
支撑剂体积
支撑剂累积体积
浆级容积
泥浆累积体积
表3
化学速率1
表4
化学第一卷
提交
我想问题是您有重复的IDsID应该是唯一的，并且在一个页面上只使用一次。您应该将它们替换为classes，如下所示（添加时）：

注:

document.getElementsByClassName（'SlurryRate'）
返回一个元素数组，因此必须填充所有元素

当然，您可以编写一个很好的函数来以更简洁的方式处理此问题，但是这应该可以工作。
问题在于ID重复。页面上的任何元素都必须具有唯一的ID。如果元素的ID重复，则每次都会选择DOM顶部的元素。

您还为每个输入字段设置了
name
属性。您可以避免添加
类
。下面的代码段为给定的
名称
选择DOM中的最后一个元素，并有效地选择最后一行-

$（输入[name=“NameOfYourField”]）.last（）.val（此字段的值）

我已经在这支笔中为您的一些输入字段实现了上述功能


您可以从中看到您的预期行为。
我正在检查代码，但它可以正常工作。一些文件是空的。我们希望通过循环迭代填充所有行。
我已经为您在这支笔中的一些**输入字段实现了上述**
…您有太多字段，我觉得有点懒：pYou可以很容易地理解并将所呈现的代码片段扩展到所有其他字段……所有字段都设置了
id
和
name
属性。您只需复制粘贴此代码段并替换jquery选择器中的
name
值和
val（）中包含该值的javascript变量名
part.我会处理所有输入，但它会用空值显示第一行我的问题是，当我们得到第一行值时，我们想在另一个表的第一行显示这些值，然后我们得到第二行的值，然后在第二行显示值
$("#tbUsers").append("<tbody><tr><td><input type='text' name='StageTime' class='StageTime' value=''></td><td><input type='text' name='SlurryRate' class='SlurryRate'></td><td><input type='text' name='CleanRate' class='CleanRate'></td><td><input type='text' name='BlenderConcentration' class='BlenderConcentration'></td><td><input type='text' name='ProppantVolumeRate' class='ProppantVolumeRate'></td><td><input type='text' name='ProppantMassRate' class='ProppantMassRate'></td><td><input type='text' name='ProppantAVG' id='ProppantAVG'></td><td><input type='text' name='ProppantStageMass' class='ProppantStageMass'></td><td><input type='text' name='ProppantCumulativeMass' class='ProppantCumulativeMass'></td><td><input type='text' name='ProppantVolume' class='ProppantVolume'></td><td><input type='text' name='ProppantCumulativeVolume' class='ProppantCumulativeVolume'></td><td><input type='text' name='SlurryStageVolume' class='SlurryStageVolume'></td><td><input type='text' name='SlurryCumulativeVolume' class='SlurryCumulativeVolume'></td></tr></tbody>");

document.getElementsByClassName('SlurryRate')[0].value = SlurryRate;
document.getElementsByClassName('SlurryRate')[1].value = SlurryRate;