该问题源于循环计数变量 len 未在每次点击时重置，导致后续生成逻辑跳过；修复只需在事件处理函数内重置 len = 0 或将其声明为局部变量，确保每次点击都从零开始构建新密码。
该问题源于循环计数变量 `len` 未在每次点击时重置，导致后续生成逻辑跳过；修复只需在事件处理函数内重置 `len = 0` 或将其声明为局部变量，确保每次点击都从零开始构建新密码。
在实现密码生成器时，一个看似微小的状态管理疏漏（如变量作用域或初始化位置错误）可能导致功能“首次有效、后续失效”。你遇到的问题正是典型示例：点击按钮后，仅第一次能生成并显示 10 位随机密码，之后输入框始终为空（即 value=""）。
根本原因在于 len 是全局声明的 let 变量（let len = 0; 在事件监听器外部），它在首次点击后被更新为 10，而后续点击并未重置——因此 while(len
✅ 正确做法是将状态变量限定在事件处理函数内部，确保每次点击都拥有干净的初始状态：
const btn = document.querySelector('.btn');
const upper = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
const lower = 'abcdefghijklmnopqrstuvwxyz';
const number = '0123456789';
const symbol = '@#$%^()_+|{}[]/-=';
// 合并字符集（使用扩展运算符更清晰）
const all = [...upper, ...lower, ...number, ...symbol];
btn.addEventListener('click', () => {
let password = ''; // 每次点击新建空密码
let len = 0; // 每次点击重置长度计数器
while (len <p>? <strong>优化建议：</strong></p>
- 使用 len++ 替代 len = password.length 可提升性能（避免重复计算字符串长度）；
- 若需支持可配置密码长度，可将 10 提取为参数或从 DOM 获取（如 ）；
- 更健壮的实现应加入字符类型强制包含（如至少 1 个大写字母、1 个符号等），避免纯数字或纯小写等弱组合。
⚠️ 注意事项：
不要在事件监听器外维护 password 或 len 等临时状态变量——这会引入隐式依赖和状态污染。函数式、无副作用的局部变量声明是前端交互逻辑稳定性的基石。
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
