html表单提示文字分三类：placeholder用属性和伪元素修改；required校验提示须用setcustomvalidity()配合事件；file控件需隐藏原生元素并用label替代，监听change显示文件名。
HTML表单控件的提示文字，主要分三类：placeholder（占位符）、required 默认校验提示、file 输入框的按钮/状态文案——改法完全不同，不能混用。
修改 placeholder 文字内容与样式
这是最常用也最直接的提示，只在输入框为空时显示，用户一聚焦就消失。
- 内容修改只需改
placeholder属性值：<input type="text" placeholder="请输入手机号"> - 样式必须用伪元素控制，不同浏览器前缀不能省：
input::placeholder（现代标准）、input::-webkit-input-placeholder（Chrome/Safari）、input::-moz-placeholder（Firefox）、input:-ms-input-placeholder（IE10+） - 注意：CSS 中不能用
input:placeholder这种写法，它不存在；也不能对placeholder做 transform 或 animation，部分浏览器不支持 - 动态更新？直接改 DOM 的
element.placeholder = "新提示"即可，无需重渲染
覆盖 required 校验失败时的默认提示
浏览器原生弹出的“请填写此字段”这类提示，无法通过 HTML 属性修改，必须用 JS 干预。
- 核心是
setCustomValidity()：传非空字符串触发错误并设文案，传''（空字符串）表示恢复有效状态 - 必须配合事件手动触发校验，否则设置无效：
oninput="this.setCustomValidity('')"清空，oninvalid="this.setCustomValidity('姓名不能为空')"设置 - 别在
input事件里反复调setCustomValidity()，容易让内部 validity 状态错乱；推荐改用blur后调reportValidity() - 如果用了
e.preventDefault()拦截了invalid事件，记得自己把提示写进对应 DOM 节点，浏览器不会帮你显示
自定义 input type="file" 的按钮文字和文件名提示
原生 file 控件的 “Choose File” 按钮和 “No file chosen” 提示完全不可 CSS 定制，只能视觉隐藏 + label 替代。
- 关键结构：
<label for="file-id">上传身份证</label><input type="file" id="file-id" class="hidden"> -
class="hidden"推荐用position: absolute; left: -9999px;或opacity: 0; width: 0; height: 0;，避免影响可访问性 - 文件名显示需监听
change事件读取e.target.files?.[0]?.name，再更新旁边文本节点 - 禁用状态下的提示（比如未选文件却点了提交），不能靠 disabled 按钮自带提示——得监听按钮 click，检查
input.files.length === 0，再手动提示
真正麻烦的不是怎么改，而是改完之后是否还在所有主流 WebView（比如微信内置浏览器旧版本）里生效。尤其是 setCustomValidity() 和 ::placeholder 在 Android 4.4 Webview 里行为不一致，上线前务必真机测。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
