javascript - 接线元件事件

Question

我最近读了一篇博文。在其中，作者告诉读者不要内联连接所有的 onclick 事件，而是在 DOM 准备就绪时连接，如下所示(jQuery 示例):

<script type="text/javascript">
$(document).ready(function() {
    $("myElement").click(...
});
</script>

这适用于页面上所有附加了事件的元素。该脚本 block 及其所有接线应位于页面末尾。

他说将其设置为内联更难维护:

<span id="myElement" onclick="...">moo</span>

但他没有说为什么。

其他人的经历是否如此？这样做是更好的做法吗？它有什么优势？

Answer 1

嗯，尽可能将代码和内容彼此分开通常被认为是一种很好的风格。如果您使用该方法，您将拥有非常干净的 HTML:

<span id="myElement">moo</span>

还有一个单独的中央代码存储库，您可以将其保存在一个地方，甚至可以放入外部 Javascript 文件中。

然后编辑 HTML 布局变得非常有趣，而且看起来也很棒。

我自己并不总是严格遵守这条规则，而且我不像其他人那样热衷于此。但我允许自己在执行内联操作时最多调用一次函数 onclick='do_stuff()'。任何更复杂的东西都会很快变成代码汤。