如何创建一个用于计算仪器刻度长度并将其放入 HTML 表中的 FOR 循环?

问题描述 投票:0回答:1

我正在尝试编写一个 JavaScript 程序,该程序将接受用户输入,即吉他使用的音阶长度以及它有多少品格,然后进行必要的计算来求解每个品格之间的距离。

我希望它的工作方式是根据需要创建变量。因此,用户输入他们的音阶和品格,程序将显示一个包含所有内容的 HTML 表格,并且仅显示他们最初输入的品格数量的行。

问题是,我对 JavaScript 完全陌生,除了知道涉及 FOR 循环之外,我对如何实现这一点一无所知。

编辑:我已经弄清楚如何让计算正确工作并在屏幕上打印,但仍然必须弄清楚如何将它们放入表格中。另外,数字应该从 1 而不是 0 开始。这是我更新的代码:

<!DOCTYPE html>
<html>

<head>
    
</head>

<body>

  

  <script type="text/javascript">
    var scaleLength = prompt("What is your desired scale length?");
    var numFrets = prompt("How many frets will you have?");
    var testing = 0;
    var distFromNut = 0;
    const fretDists = [];
        
        for (let i = 0; i < numFrets; i++) {
            testing = (scaleLength - distFromNut) / 17.817;
            fretDists.push(testing);
            distFromNut = fretDists[i] + distFromNut;
            document.write(i + ": " + distFromNut.toFixed(4) + "<br>");
        }
  </script>

</body>
</html>

javascript html for-loop variables
1个回答
0
投票

所以在 HTML 中我会创建一个简单的表格

<body>
    <table>
        <tbody id="main-table">
        </tbody>
    </table>
</body>

然后在 JavaScript 中您可以添加表格行和单元格

let main_table = document.getElementById("main-table");

for (let i = 0; i < numFrets; i++) {
    // Create new row and cells for the table
    let row = document.createElement("tr");
    let cell1 = document.createElement("td");
    let cell2 = document.createElement("td");

    testing = (scaleLength - distFromNut) / 17.817;
    fretDists.push(testing);
    distFromNut = fretDists[i] + distFromNut;

    // Add the cells to the row and the row to the table body
    cell1.appendChild(document.createTextNode(i + 1));
    cell2.appendChild(document.createTextNode(distFromNut.toFixed(4)));
    row.appendChild(cell1);
    row.appendChild(cell2);
    main_table.appendChild(row);
}
© www.soinside.com 2019 - 2024. All rights reserved.