javascript: onClick= " " vs. jQuery.Click()



我有很多带有onClick事件的页面(每个页面都有自己的onClick Event的其他元素)。所有页面都包含在一个主页(index.php)中

因此,我不能将所有jQuery onClick事件都放在页面的头部(因为<head>只在index.php中,而不在包含的页面中)

现在在我包含的每一页中制作一个<script>...</script>是否更好?因为这不会出现在<head>中。

还是应该使用HTML-属性onClick=""

现在是不是更好地制作。。。在每一页我包括因为这不会在。

<script>标签不需要在头部,实际上,最佳位置(性能方面)就在关闭</body>之前。是的,您还希望尽可能多地使用外部JS文件。

或者我应该使用HTML属性onClick="?[…]我无法将所有jQuery onClick事件都放在页面的头部(因为只是在index.php中,而不在包含的页面中)

通常,您几乎总是希望避免添加大量事件,相反,您希望使用jQuery.on来利用事件冒泡。

一个示例用法可能是:

$(document).ready(function() {
$('body').on('click', '.myselector', function(e) {
alert('Parameter: ' + $(this).attr('data-param'));
});
});

你的HTML看起来像:

<a href="#" class="myselector" data-param="Hello!">This is a button</a>

这将只绑定主体上的一个事件。当你点击正文中的任何内容时,事件将冒泡到正文中,如果你点击这个选择器,事件就会被执行。如果页面上没有.myselector,它将不会起任何作用,所以也没关系。

实际上,所有JavaScript都应该放在外部文件中。这是为了性能和可维护性。

性能,因为浏览器可以缓存外部脚本,从而减少加载时间。

可维护性,因为您最终不必搜索大量的HMTL文档来获得一点JavaScript。

HMTL中的JavaScript也会干扰解析器,您需要注意这一点。

如果不可能将所有脚本都包含在外部文件中,你应该重新考虑你的网站架构,因为这是应该的。

阅读Unobstrusive Javascript:

http://en.wikipedia.org/wiki/Unobtrusive_JavaScript

最新更新