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

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/21935365/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-27 01:46:30  来源:igfitidea点击:

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

jqueryhtmlonclick

提问by Quantm

I have many pages with onClick-Events(every page got other elements with it's own onClick-Event). All pages get included to one main-Page (index.php)

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

Thus, I can't put all of the jQuery onClick-Events in the head of the page (because the <head>is just in index.php, not in the included pages)

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

Is it now better to either make a <script>...</script>in every page I include? Because this wouldn't be in the <head>.

现在<script>...</script>在我包含的每个页面中都制作一个更好吗?因为这不会在<head>.

Or should I use the HTML-attribute onClick=""?

或者我应该使用HTML-attributeonClick=""吗?

采纳答案by Martin Tournoij

Is it now better to either make a ... in every page I include? Because this wouldn't be in the .

现在最好在我包含的每一页中制作一个 ... 吗?因为这不会在 .

<script>tags don't need to be in the head, actually, the best place (performance-wise) is right before the closing </body>. And yes, you also want to use external JS files as much as possible.

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

Or should I use the HTML-attribute onClick="" ? [...] I can't put all of the jQuery onClick-Events in the head of the page (because the is just in index.php, not in the included pages)

还是应该使用 HTML 属性 onClick="" ?[...] 我不能把所有的 jQuery onClick-Events 放在页面的头部(因为它只是在 index.php 中,而不是在包含的页面中)

In general, you almost always want to avoid adding lots of events, instead, you want to take advantage of event bubbling using jQuery.on.

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

An example usage might be:

一个示例用法可能是:

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

You HTML would look something like:

你的 HTML 看起来像:

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

This will bind only oneevent, on the body. When you click on anything inside the body, the event will bubble up to the body, and get executed if you clicked inside this selector. If there's no .myselectoron the page, it'll do nothing, so that would be okay.

这将只绑定一个事件,在身体上。当您单击 body 内的任何内容时,该事件将向上冒泡到 body,如果您在此选择器内单击,则该事件将被执行。如果.myselector页面上没有,它什么也不做,所以没关系。

回答by Kevin

Really, all JavaScript should be placed in external files. This is for performance and maintainability.

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

Performance because external scripts can be cached by the browser, decreasing loading times.

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

Maintainability because you don't end up having to trawl through massive HMTL documents to get to a bit of JavaScript.

可维护性,因为您最终不必通过大量 HMTL 文档来获取一些 JavaScript。

JavaScript within HMTL can also mess with the parser, which you need to be aware of.

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

If it's not possible to include all your scripts in external files you should really re-think your website's architecture, as this is how it should be.

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

回答by Hackerman