label与textarea必须通过for/id显式绑定或嵌套方式关联，否则点击文字无法聚焦且无障碍失效；for值须与id严格一致（大小写、符号、空格均敏感），嵌套仅支持单个原生控件。
label 和 textarea 必须通过 id/for 显式绑定，或采用嵌套写法；否则点击文字无法聚焦到文本域——这不是样式问题，是语义缺失导致的可访问性失效。
label 的 for 属性必须严格匹配 textarea 的 id
浏览器不校验、不报错，但只要大小写、连字符、下划线或空格有一处不一致，label 就完全失效。常见错误包括：
-
<label for="desc">描述</label><textarea name="desc"></textarea>→ 缺少id="desc"，点击无反应 -
<label for="description">描述</label><textarea id="desc"></textarea>→ 字符串不等，绑定失败 -
<label for="Description">描述</label><textarea id="description"></textarea>→ 大小写敏感，不匹配
实操建议：写完 textarea 后，直接复制它的 id 值粘贴到 label 的 for 中；用 DevTools 选中 label，再全局搜索该 for 值是否作为 id 唯一存在。
嵌套写法更可靠，但有明确限制
把 textarea 直接写进 label 标签内部，天然建立关联，无需 id 和 for：
立即学习“前端免费学习笔记（深入）”；
<label>反馈内容：<textarea name="feedback" rows="4" cols="50"></textarea></label>
这种方式适合单个原生控件，但注意：
- 仅支持
<input>、<textarea>、<select>、<button>—— 不能包<div>或自定义组件 - 不适用于一组
radio或多个checkbox，一个label只能激活其内部第一个可交互元素 - 若后续用 JS 移动
textarea节点（如拖拽重排），嵌套结构会断裂，语义丢失
textarea 默认值不能用 value 属性
这是和 input 最容易混淆的点：textarea 的初始内容必须写在起始与结束标签之间，而非 value 属性里：
<!-- 正确 --> <textarea name="bio">请输入您的个人简介</textarea> <p><!-- 错误（会被忽略）--> <textarea name="bio" value="请输入您的个人简介"></textarea>
如果同时用了 value 属性又写了标签内文本，浏览器以标签内文本为准，value 完全无效。配合 label 使用时，这个规则不变——默认值位置与绑定方式无关。
name 属性不可省略，且需与后端字段对齐
textarea 提交时靠 name 传参，不是 id，也不是 for 值。漏掉 name 会导致表单提交后服务器收不到该字段：
-
<textarea id="comment"></textarea>→ 提交无数据 -
<textarea id="comment" name="comment"></textarea>→ 正常提交为comment=xxx
另外，name 值应与后端接收字段名保持一致（如 PHP 的 $_POST['comment']），前端改 id 不影响提交逻辑，但改 name 会直接断链。
真正容易被忽略的是：即使视觉上 label 文字紧挨着 textarea，只要没做语义绑定，屏幕阅读器就无法将其识别为同一控制单元——这对无障碍合规是硬性缺陷，而不仅仅是“点击不聚焦”这么简单。
