运行 Javascript 使用 onclick？

Question

如果我设置如下：

<script type="text/javascript" src="https://test.com/abc"></script>

在 head 标签之间，代码在页面启动时运行。有什么方法可以在启动期间从运行停止它，而不是运行它使用 html 按钮的 onclick 方法吗？

Answer 1

将文件中的 javascript 放入一个函数中。然后，您可以将该功能分配给按钮的 onclick 属性。

<button onclick="myFunction()">Click Me</button>

还有你的剧本

function myFunction() { 
    //your existing code goes here
}

这是一个fiddle。

Answer 2

1- 你应该尽量避免在头部添加脚本，因为它会导致页面呈现缓慢。如果你真的需要这样做，你可以寻找延迟/异步脚本。

2- 您应该尝试将脚本放在底部以使浏览器尽可能快地呈现所有 html 和 css。

3- 最后，您应该在底部调用加载页面。例如，在 jquery.ready 中，如本文档所述，搜索 jquery 就绪事件。在那一刻，您应该通过在按钮上调用 jquery 选择器，为您需要的按钮添加一个侦听器，搜索 jquery 选择器，最后添加点击事件，搜索 jquery click事件，然后在该回调中处理您需要的内容。

这里是fiddle.

[https://jsfiddle.net/d6zfqpc6/][1]

Jquery 对某些东西也是一个很好的 polyfill :).

Answer 3

虽然onclick方法是一个很好的方法，但是it is no longer supported.

addEventListener方法是最合适的，也是最现代的方法。

有两种用法：

将已存在的函数连接到事件侦听器：

document.getElementByID("clickMe").addEventListener("click", myfunction);

在事件侦听器中编写函数：

document.getElementByID("clickMe").addEventListener("click",  function() {
//a function, for eg.:
document.getElementById("p").innerHTML = "Hello World";
});

为了便于理解，这里有一个示例片段：

   
document.getElementById("clickme").addEventListener("click", function() {
  document.getElementById("p").innerHTML = "Hello World";
});

<button id="clickme">Try it</button>
<p id="p"></p>

此外，我建议您使用页面底部的 script 而不是头部，这样 HTML 和 CSS 可以先加载。

希望能帮到你。

运行 Javascript 使用 onclick？

Run Javascript using onclick?

html

javascript

onclick