应优先使用 hidden 属性隐藏 ，语义清晰、保留数据且不影响表单提交；若仅传值不编辑，改用 ；避免 display: none，因其破坏表单行为和无障碍支持。
textarea 是表单控件，不是表格原生单元格元素。如果你在 <td> 里嵌了 <code><textarea></textarea>，想“隐藏它”，得先分清目标：是隐藏整个单元格？还是只隐藏这个可编辑区域但保留数据？还是让它不可见但还能提交？不同目的，解法完全不同。
用 hidden 属性隐藏 textarea 元素本身
直接给 <textarea></textarea> 加 hidden 属性是最干净的语义化隐藏方式——不占空间、不聚焦、不读屏、仍保留在 DOM 中，value 值也还在，JS 可随时读写。
示例：
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
<td> <textarea name="note" hidden>草稿内容</textarea> </td>
注意：hidden 对 <textarea></textarea> 有效，但它不会影响父 <td> 的布局；如果想连 <code><td> 一起藏掉，得另外给 <code><td> 也加 <code>hidden。
立即学习“前端免费学习笔记（深入）”；
常见失效原因：
- CSS 里写了
textarea { display: block !important; }—— 必须加兜底规则：[hidden] { display: none !important; } - 之前用过
el.style.display = 'none'，后来设el.hidden = false却没恢复：记得清掉内联样式，el.style.display = ''再设hidden = false
用 type="hidden" 替代 textarea（仅当不需要编辑）
如果这个字段只是传值、用户根本不用改，就别用 <textarea></textarea> 了。换成 <input type="hidden"> 更轻量、更安全、更符合语义。
示例：
<td> <input type="hidden" name="note" value="草稿内容"> </td>
关键点：
-
type必须小写"hidden"，不能写成"HIDDEN"或"hide" -
name不可省略，否则表单提交时后端收不到 - 别用
style="display:none"包裹普通<input type="text">来“假装”隐藏——它仍可被 DevTools 修改、触发事件、被自动化工具操作
隐藏 td 单元格，连带里面的 textarea 一起消失
如果目标是让整列或某一行的编辑区不可见（比如权限控制下收起备注列），应该操作 <td> 或 <code><tr>，而不是只动里面的 <code><textarea></textarea>。
推荐写法：
<td hidden> <textarea name="note">草稿内容</textarea> </td>
优势：
-
hidden具有继承性：父<td hidden> 会让内部所有子元素（包括 <code><textarea></textarea>）自动不可见、不可聚焦 - 比给每个子元素单独加
hidden更简洁，且避免遗漏 - 恢复显示只需移除
<td> 上的 <code>hidden，无需逐个处理子元素注意：若该
<td> 所在行用了 <code>colspan，隐藏后浏览器会重新计算列对齐，可能导致视觉错位——这种场景建议提前规避colspan，或改用 JS 动态重绘逻辑。不要用 display: none 控制 textarea 的显隐
虽然
style="display:none"能让<textarea></textarea>消失，但它会破坏表单行为：- 设置
display: none后，该<textarea></textarea>不会出现在FormData中，也不会被form.elements收录 - 即使你用 JS 临时设回
display: block，它的 focus 状态、滚动位置、光标位置全丢失 - 与
hidden属性相比，它没有语义，无障碍支持差，且容易被 CSS 规则意外覆盖
唯一能接受
display: none的情况，是你明确知道这个<textarea></textarea>纯属占位、从不参与提交，且后续也不需要 JS 交互——但这种需求极少。最易被忽略的一点：
<textarea></textarea>在<td> 里时，它的默认垂直对齐（<code>vertical-align: middle）和resize行为可能干扰表格高度。隐藏前最好确认是否已清除这些副作用，否则显示/隐藏切换时会出现意外的行高跳变。 - 设置
