最可靠做法是用 scrollheight 动态设 style.height，需先清空高度再读取并赋值；rows 属性不可靠，受字体、缩放等影响且无法响应内容增长；须监听 input 事件、处理边界情况并禁用 resize。
直接用 scrollHeight 动态设 style.height 是目前最可靠、兼容性最好的做法，其他方案（比如改 rows、依赖 white-space 或 wrap）要么不准，要么不解决高度问题。
为什么不能只靠 rows 属性调高度
rows 是语义化提示值，不是真实高度控制手段。它受字体、行高、缩放、padding 影响极大；用户缩放页面后，rows="5" 可能只显示 3 行，或撑出滚动条。更关键的是：它无法响应内容增长——输入 100 行后，rows 还是 5，视觉上必然截断或溢出。
- 别写
textarea.rows = Math.ceil(textarea.scrollHeight / baseLineHeight)这类逻辑，baseLineHeight在不同浏览器、不同字体下根本不可靠 - 移动端 Safari 和旧版 IE11 对
rows渲染偏差大，尤其遇到\r\n换行时计算失准 - 如果用了 CSS 的
line-height或font-size变化，rows就彻底失效
用 scrollHeight 自适应的正确写法
核心就三步：清空当前高度 → 读取 scrollHeight → 写回 style.height。漏掉第一步（设 'auto'），scrollHeight 会卡在旧值上不动。
使用HTML,CSS,JavaScript开发Android应用程序 英文文字pdf版附源文件
下载
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
- 监听
input事件，不是change（后者只在失焦时触发） - 每次更新前必须先执行
textarea.style.height = 'auto' - 赋值时用
textarea.scrollHeight + 'px'，不要加 magic number 补偿（除非专为 IE11 且不能改换行符） - iOS Safari 有渲染延迟，可包一层
requestAnimationFrame或setTimeout(..., 0)
textarea.addEventListener('input', () => {
textarea.style.height = 'auto';
textarea.style.height = textarea.scrollHeight + 'px';
});
容易被忽略的边界情况
自适应不是设完就一劳永逸。几个真实场景中高频出问题的点：
- 初始为空时，
scrollHeight可能过小（尤其在 IE11 或有 padding 的情况下），建议设个min-heightCSS 值兜底 - 粘贴大段文本时，
input事件可能滞后，加个paste监听并setTimeout(update, 0)更稳 - 禁用
resize拖拽是必须的：textarea { resize: none; }，否则用户手动拉伸会破坏 JS 控制的高度 - 如果表单里有多个
textarea，别共用一个事件处理函数却不绑定this，容易互相覆盖高度
真正难的不是“怎么让高度变”，而是“怎么让它不变形、不跳动、不残留空白”。所有看似简单的自适应，最终都落在对 scrollHeight 更新时机和重置节奏的把控上——少一次 height = 'auto'，就可能多一次光标错位。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
