无法通过JavaScript修改text input内容的技术求助

你的核心问题是脚本执行时机不对，导致无法正确获取并修改input元素的值。

问题根源 #

你把<script src="script.js"></script>放在了<head>标签里，此时浏览器还未渲染<body>中的DOM元素，执行document.getElementById("contraseñaGenerada")会返回null，后续设置value的代码自然无法生效。

验证方法 #

可以在代码里添加日志确认这一点：

let contraseña = document.getElementById("contraseñaGenerada");
console.log(contraseña); // 控制台会输出null

解决方案（任选其一即可） #

• 方案1：调整脚本位置
  把script标签移到<body>的最后，</body>标签之前，确保DOM完全加载后再执行脚本：

<!-- 其他body内容 -->
    <script src="script.js"></script>
</body>

• 方案2：监听DOM加载完成事件
  在script.js中把代码包裹在DOMContentLoaded事件监听里：

document.addEventListener('DOMContentLoaded', function() {
    let contraseña = document.getElementById("contraseñaGenerada");
    contraseña.value = "123";
});

• 方案3：给script标签添加defer属性
  修改head中的script标签，添加defer属性让脚本等待DOM加载完成后执行：

<script src="script.js" defer></script>

补充说明：对于<input type="text">这类表单元素，修改内容必须使用.value，你最开始的contraseña.value = "123"写法是正确的，innerText确实不适用于表单输入框，无需调整这部分代码。

内容的提问来源于stack exchange，提问作者Valentín Sanabria