spellcheck属性在contenteditable元素上生效的前提是contenteditable="true"，否则无效；firefox、chrome、edge支持较好，safari对contenteditable区域支持弱，常忽略设置，需配合autocorrect="off"等属性或改用textarea以确保效果。
spellcheck 属性在 contenteditable 元素上是否生效
生效，但有前提：元素必须是可编辑的（contenteditable="true" 或原生表单控件），且浏览器支持该属性。Firefox、Chrome、Edge 均支持，Safari 对 contenteditable 区域的 spellcheck 支持较弱（尤其 macOS 上常忽略设置）。
常见错误现象：div[contenteditable] 写了 spellcheck="false" 却仍有红色波浪线——大概率是 Safari 或系统拼写检查劫持了行为。
实操建议：
• 确保同时设置 contenteditable="true" 和 spellcheck="false"（不能只设后者）
• 在 Safari 中，还需配合 CSS 关闭系统级提示：style="-webkit-user-modify: read-write; -webkit-text-security: none;"（效果有限，但值得一试）
• 若需强一致性，改用 textarea 或 input —— 它们对 spellcheck 的响应更可靠
spellcheck="true" 与 spellcheck="false" 的实际差异
不是“开/关拼写检查”那么简单，而是控制**是否标记疑似拼写错误的单词**。它不阻止用户输入错词，也不自动纠正。
关键区别：
• spellcheck="true"：浏览器用系统词典标出未识别词（红色波浪下划线），右键菜单可能提供纠错建议
• spellcheck="false"：完全不标波浪线，也不触发右键拼写建议菜单（部分浏览器仍可能显示“添加到字典”等通用项）
注意点：
• spellcheck 是枚举属性，只认 "true" 和 "false" 字符串值，写成 spellcheck 或 spellcheck="" 会被当作 true
• 它对非拉丁文字（如中文、日文）基本无作用，因为主流浏览器拼写检查默认只针对拉丁语系词典
在 textarea 和 input 中设置 spellcheck 的兼容性表现
textarea 和 input[type="text"] 是 spellcheck 行为最稳定的载体，推荐优先使用。
典型用法：<textarea spellcheck="false"></textarea><input type="text" spellcheck="true">
影响因素：
• 浏览器会尊重系统设置：若 macOS “系统偏好设置 > 键盘 > 文本”中关闭了“拼写检查”，即使 spellcheck="true" 也无波浪线
• Chrome 在 input 上对短单词（如 “a”, “i”）可能跳过检查，而 textarea 更严格
• 移动端（iOS/Android）基本忽略 spellcheck，由软键盘自身策略决定，无法强制禁用
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
动态修改 spellcheck 属性为何有时不立即生效
直接 JS 修改 element.spellcheck = false 或 element.setAttribute('spellcheck', 'false') 后，波浪线可能残留，尤其在已输入文本的 contenteditable 中。
根本原因：浏览器不会重新扫描已有 DOM 文本节点的拼写，只对后续输入或焦点切换时的新词触发检查逻辑。
绕过方法：
• 强制重绘：修改后短暂 blut + focus（el.blur(); el.focus();）
• 清空并恢复内容（慎用，会丢失光标位置和格式）：const html = el.innerHTML; el.innerHTML = ''; el.innerHTML = html;
• 更稳妥的做法：不要动态切换，而是在初始化时就确定值；若必须切换，优先用 textarea 替代 div[contenteditable]，其响应更及时
拼写检查行为高度依赖浏览器实现和操作系统底层支持，spellcheck 只是提示而非指令。真正需要屏蔽拼写反馈的场景（比如代码编辑器、数学公式输入），别依赖它，而应结合 inputmode="verbatim"、CSS text-decoration: none 隐藏波浪线，或用 contenteditable="plaintext-only"（实验性）限制格式。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
