开发带宽高调节功能的迷你图片编辑器遇问题：点击按钮图片不增宽

你的代码存在两个关键问题，导致图片宽度不更新：

• 仅执行了宽度数值的计算，但没有将计算结果赋值回图片的width样式属性，DOM不会自动感知数值变化
• document.getElementById("testimage").style.width 返回的是带单位的字符串（比如 "200px"），直接加10会触发字符串拼接（变成 "200px10"），而非预期的数值累加

修正后的代码 #

function go1() {
  // 提前获取图片元素，避免每次定时器回调重复查询DOM
  const img = document.getElementById("testimage");
  // 存储定时器ID，方便后续清理
  const timer = setInterval(() => {
    // 获取当前宽度：若style.width为空，用offsetWidth取实际渲染宽度
    let currentWidth = img.style.width ? parseInt(img.style.width) : img.offsetWidth;
    // 累加后添加单位，赋值回style.width
    img.style.width = `${currentWidth + 10}px`;
  }, 250);
  
  // 可选：若需要停止缩放，可通过clearInterval(timer)清除定时器
}

额外注意事项 #

• 多次点击按钮会创建多个定时器，导致宽度加速变化，建议在函数开头先清除之前的定时器
• 若图片初始未通过style设置宽度，img.style.width会是空字符串，此时用offsetWidth能获取图片实际渲染的宽度值

内容的提问来源于stack exchange，提问作者samuraiskiy