直接在HTML中将JS绑定到HTML DOM事件吗？

Question

之前我问过一个问题，关于将JS嵌入页面中，而不是将其放置在正文的头部或末尾， 将JavaScript嵌入文档的正文中？ 。

我现在的问题是，将JS绑定到HTML DOM事件的最佳方法是什么？ 我可以：

• 等待文档加载完毕，然后运行脚本，将功能绑定到所需元素上的所需事件； 要么
• 在编写HTML时将函数直接绑定到DOM元素

在某些情况下，我意识到我别无选择，但是在简单的情况下，我倾向于采用第二种选择。 例如，这是我要初始化自动搜索栏的方式：

<input id="auto-search" value="Search for person by name" onfocus="this.value=null"/>

这听起来很自然，但缺点是我的JS现在散布在我的HTML中，而不是很好地藏在一个文件中。 你是做什么？

作为一种较长期的方法，我喜欢RequireJS的想法，但我还没有准备好对此进行研究。

Answer 1

不内联这样的事件处理程序的一个主要原因是，它无法与jQuery之类的库一起很好地工作。 jQuery在事件处理方面做得很多。 例如，它们标准化了在事件处理程序中传递的事件对象，因此无论您的用户使用哪种浏览器，它的外观都相同。 具有事件处理功能的其他主要库也执行类似的操作。

如果您使用on *属性“内联”连接事件，则jQuery（或您使用的任何库）将不会意识到它们，因此将无法规范化事件对象或为您轻松解除绑定事件。

更广泛地说，将Javascript保留在Javascript文件中具有一般好处。 并不是所有的方法都适用于这么小的东西，但是作为一般惯例，我认为大多数开发人员都建议不要使用on *属性。