用最小可运行HTML结构起步：必须有<table>且不嵌套在<p>/<div>外，首行用<th>表头，每行<th>/<td>数量对齐；推荐加<html><body>和<style>控制边框、布局与响应式。
<table> 结构，保存为 .html 文件双击打开，或者粘贴到在线 HTML 编辑器里点运行，立刻看到表格。
怎么快速写出能跑的表格 HTML 代码？
别从空文件开始——用最小可运行结构起步，避免语法错误导致白屏或错乱：
-
<table>必须有，且不能嵌套在<p>或<div>外面（会触发浏览器自动修复，可能打乱结构） - 第一行建议用
<th>写表头，语义正确、默认加粗居中，屏幕阅读器也能识别 - 每行
<tr>里，<th>和<td>数量要对齐，否则列会错位（常见于复制粘贴时漏了</td>） - 不需要写
<html><body>也能运行，但加上更稳妥；<thead>/<tbody>不是必须，但加了便于后续用 CSS 或 JS 控制样式和逻辑
一个可直接复制运行的示例：
<!DOCTYPE html>
<html>
<head><title>在线表格</title></head>
<body>
<table border="1">
<tr><th>姓名</th><th>城市</th></tr>
<tr><td>王五</td><td>杭州</td></tr>
</table>
</body>
</html>
在线运行时为什么表格不显示边框或样式混乱？
因为现代浏览器默认不渲染 border，也不合并单元格边线，纯靠 CSS 控制视觉效果。而 border="1" 是旧式写法，虽能临时出效果，但会干扰 CSS 覆盖，且不符合可访问性规范。
- 去掉
border="1"属性，改用 CSS：table { border-collapse: collapse; }+th, td { border: 1px solid #ccc; padding: 6px; } - 如果用了
<thead>，记得给<th>单独设背景色，否则和<td>混在一起看不出表头 - 在线编辑器如 JSFiddle、CodePen 默认禁用内联样式（如
style="border:1px"），所以优先把 CSS 写在<style>标签里 - 中文内容若出现换行错位，大概率是没设
table-layout: fixed;或单元格没设word-break: break-all;
动态填数据时 tbody 里追加行总失败？
常见原因是 DOM 没加载完就执行 JS，或选择器写错——比如用 document.querySelector('table') 拿到了多个表格，却只操作了第一个。
立即学习“前端免费学习笔记（深入）”；
- 确保 JS 放在
</body>前，或用DOMContentLoaded包裹 - 给目标表格加唯一
id，例如<table id="user-table">，再用document.getElementById('user-table').querySelector('tbody')精准定位 - 追加行不要拼接字符串后
innerHTML +=，容易 XSS 风险且破坏事件监听；改用insertRow()+insertCell()方法更安全 - 如果数据来自 API，注意跨域限制：本地双击打开的
file://页面无法发fetch请求，必须起一个本地服务（如 Python 的python -m http.server）或换用在线平台
</tr>、CSS 选择器权重不够被覆盖、或者根本没触发 JS 执行时机。先验证最简结构能否跑通，再一层层加功能。 
