表格中嵌入input需确保结构合法、样式适配和JS正确操作：必须显式声明tbody，用insertCell()再appendChild()插入input；td设padding:0并统一vertical-align；input需有唯一name且置于form内，多行内容用textarea；避免DOM复用和innerHTML拼接。
直接在 <td> 或 <th> 里写 <input> 就能嵌入，但多数人卡在 DOM 错乱、样式错位或 JS 拿不到值上——问题不在能不能放，而在于怎么放才不崩。
表格结构必须合法，否则 insertRow() 插入的 <input> 会消失
浏览器只允许 <table> 的直接子元素是 <thead>、<tbody>、<tfoot> 或 <tr>。如果误把 <div> 或其他块级元素塞进 <table>，浏览器会自动“修复”：移出表格或丢弃内容，导致后续 JS 动态插入的 <input> 看不见。
- 删掉所有
<table>内部的<div>、<section>等非表格语义标签 - 显式声明
<tbody>，哪怕为空 —— 这样tbody.insertRow(-1)才能稳定插入到正确位置 - 动态创建行时，先用
row.insertCell(0)得到单元格，再用cell.appendChild(inputEl)，别用innerHTML += '...'拼字符串（会重置 input 的 value 和 focus 状态）
<input> 放进 <td> 后样式塌陷或高度不一致
<td> 默认有 padding 和 vertical-align: middle，而 <input> 是基线对齐的内联替换元素，两者叠加会导致输入框上下留白、文字偏高、边框重叠。
- 给
<td>加padding: 0，再单独给<input>设padding: 4px 8px和border: 1px solid #ccc - 统一
<td>的vertical-align: top或bottom，避免基线浮动引发行高跳变 - 移动端注意
input[type="text"]在 iOS 上可能被缩放，加style="-webkit-text-size-adjust: 100%;"防止自动放大
JS 无法读取或设置输入框的值？检查 name 和表单上下文
输入框不在 <form> 内，或没设 name，提交时字段就“凭空消失”；动态生成的 input 如果复用同一个 DOM 节点，也会出现值错乱。
html-to-pptx-converter
下载
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
立即学习“前端免费学习笔记（深入）”；
-
name属性必须存在且唯一（用于表单序列化），不能只靠id——formdata.get('xxx')或form.xxx.value都依赖它 - 避免用
document.createElement('input')创建后反复appendChild()同一个节点：DOM 元素移动时会脱离原位置，旧引用失效 - 若表格不在
<form>标签内，需手动收集值：Array.from(table.querySelectorAll('input')).map(el => [el.name, el.value])
单行/多行输入选错标签，回车行为和提交逻辑全乱
用 <input type="text"> 写地址、备注、反馈，用户按 Enter 就会意外触发表单提交；而 <textarea> 不设 name 或漏掉结束标签，后端根本收不到内容。
- 需要换行、软回车、滚动条的场景，必须用
<textarea>—— 它的内容写在开始与结束标签之间，不是靠value属性 -
<input type="text">的maxlength按字符计，<textarea>的同名属性也生效，但要注意中文、emoji 都算一个字符 - 不想让 Enter 提交表单？给
<input>加type="text"并监听keydown，遇到event.key === 'Enter'时event.preventDefault()
最常被忽略的是：表格里每个 <input> 的 name 是否真被后端识别、<tbody> 是否显式存在、以及动态插入时有没有清空旧引用 —— 这三点不验，调试半天也找不到值去哪儿了。
