JS根据输入框数值控制div旋转，transform属性写法不生效问题求助

• 字符串拼接语法错误：push()是数组专属方法，不能用来拼接字符串，你写的"rotate(".push(n)")"完全不符合JS语法，会直接抛出报错。你最初尝试的.style.transform = "rotate(" + n + "deg)"写法本身是正确的，错误出在后续改用了数组push方法拼接字符串。
• 冗余形参：函数fs定义时声明了形参n，但实际调用时没有传递任何参数，虽然后续你重新给n赋值为输入框的值不会影响功能，但属于无效冗余代码。
• 样式缺失问题：目标div默认无宽高、背景等样式，就算旋转逻辑生效也看不到效果，需要补充基础样式。

修改后JS代码 #

// 去掉无用形参
function fs() {
  const n = document.querySelector('input').value;
  // 用模板字符串拼接语法更简洁清晰，也可以替换成你最初的加号拼接写法
  document.getElementById('bb').style.transform = `rotate(${n}deg)`;
  console.log(n + "deg");
}

如果你习惯传统加号拼接写法，下面的写法同样可以正常生效：

document.getElementById('bb').style.transform = "rotate(" + n + "deg)";

可选补充CSS样式（让div可见） #

#bb {
  width: 100px;
  height: 100px;
  margin: 20px 0;
  background: #2196F3;
  /* 可选：加过渡效果让旋转更丝滑 */
  transition: transform 0.3s ease;
}

原有HTML代码无需修改，可以正常调用函数实现效果。

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