Javascript 为什么要将输入集中在页面加载而不是内联？

我看到的几乎所有设计用于将焦点设置为输入框的网页都将代码添加到body onload事件中。这将导致在加载整个html文档后执行代码。从理论上讲，这似乎是一个很好的做法

然而，根据我的经验，这通常会导致对用户的双重工作，因为他们已经在两个或三个字段中输入了数据，并且当光标在不知情的情况下跳回时正在另一个字段中输入数据。我看到数量惊人的用户在用户名字段的开头键入了最后2/3的密码。因此，我总是在输入之后立即放置JS焦点代码，以确保没有延迟

---

我的问题是：是否有任何技术原因不将此焦点代码内联？在页面末尾或在onload事件中调用它是否有好处？考虑到明显的实际缺陷，我很好奇为什么这已经成为一种普遍做法。

谷歌和雅虎都建议出于性能原因将脚本放在html页面的底部

雅虎文章：

如果脚本意味着正确的用户体验，那么您肯定应该将其放置在适当的位置——事实上，我会在输入之前加载脚本的这一部分（用于制表输入），以确保无论连接速度有多慢，它都能正常工作

“document.ready”函数允许您确保要引用的元素位于dom中，并在加载整个文档dom时正确激发（这并不意味着图像已完全加载）

---

如果需要，您可以将输入设置为禁用，然后在DocumentReady上重新启用它们。这将处理在显示输入时脚本尚未准备好的罕见情况。

如果在加载整个页面之前调用它，则在调用时确实不知道元素是否已加载。如果你事先打电话，你应该检查这个元素是否真的存在，即使你知道它总是应该存在的

然后进行内联调用，这似乎很理想。但另一方面，如果一个页面的加载时间太长，以至于在加载阶段可以进行多次输入，那就太糟糕了

此外，您还可以检查是否进行了输入等。

一些想法：

我会使用像jQuery这样的框架，并在

$（document）上运行这种类型的代码。ready（…

.window.onload直到页面上的所有内容都被完全加载后才会运行，这解释了您所经历的延迟。

$（document）。ready（…

在jQuery确定已加载DOM时运行。在没有jQuery的情况下，您可能会编写相同类型的逻辑，但它会因浏览器而异

我更喜欢将我的Javascript与HTML分开，因为它允许更清晰地分离关注点。然后，你的行为与你的文档结构分开，文档结构与你在CSS中的表示分开。这也允许你更容易地重用逻辑和维护代码——可能是跨项目。

---

此外，还可以检查页面上的任何输入是否包含focus

if（$（（$（“输入：：焦点，文本区域：：焦点”）.length）…

并将焦点设置在所需的输入上。

使用

自动焦点

HTML属性指定最初应该接收焦点的元素。这将解耦JavaScript并在旧浏览器中正常降级。

这并不是一些开发人员做的最糟糕的事情。回答您的问题：最佳实践是使用

自动焦点

attribute。自动对焦不是HTML5的一个属性吗？如果是，这不限制向后兼容性吗？这是一个很好的观点；我甚至没有考虑可能的性能影响。谢谢。