使用HTML+JavaScript循环生成指定单元格数的10列表格求助

错误原因说明 #

• 行数计算错误：原有代码直接用num/10作为行循环边界，非10倍数的数值会因取整逻辑丢失最后不满10个单元格的行，需使用向上取整方法计算总行数
• 单元格未按序编号：未设置计数变量，直接输出总数值num，新增计数变量每生成一个单元格自增1即可，同时要增加判断避免最后一行生成多余的单元格
• 隐藏问题修复：prompt返回值为字符串类型，需先转为数值；输入超出范围时原有代码仅弹出提示未赋值默认值100，同步修复

修复后完整代码 #

<html>
  <head>
     <style>
            table{width: 70%;}
     </style>
     <script>
        // 将prompt返回的字符串转为数值类型
        let num = Number(window.prompt("请输入1-500之间的数值"))
        // 输入非法或超出范围时赋值默认值100
        if(isNaN(num) || num < 1 || num > 500)
        {
            window.alert("警告：输入必须在1到500之间，将使用默认值100")
            num = 100
        }
     </script>
  </head>
  <body>
    <h1>Javascript循环与函数</h1><br>
    <script>
        document.write('<table border="1">')
        // 向上取整计算所需总行数
        const totalRow = Math.ceil(num / 10)
        // 定义单元格顺序计数变量
        let count = 1
        for (let row = 1; row <= totalRow; row++) {  
            document.write("<tr>")
            for (let col = 1; col <= 10; col++) {
                // 计数超过总单元格数时停止生成
                if(count > num) break
                document.write(`<td>${count}</td>`)
                count++
            }       
            document.write("</tr>")
        }
        document.write("</table>")
    </script>
 </body>
</html>

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