html GlobalEventHandlers 中是否不推荐使用 onChange 或 onClick？答案

【问题标题】：Is onChange or onClick deprecated in html GlobalEventHandlers?html GlobalEventHandlers 中是否不推荐使用 onChange 或 onClick？
【发布时间】：2016-01-29 11:36:31
【问题描述】：

我看到它在网站上使用，所以我不确定。我可以在我的 html 中使用 OnChange 和 onClick 吗？我有点困惑，我认为 javascript 在 html 中已被弃用？但是，我认为这两个操作是DOM GlobalEventHandlers 吗？我认为 jquery 经常使用它，所以我应该没问题？

<select id="select" class="button" onChange=getValue()>

我觉得html中不使用js是什么意思

<p javascript:code> </p>

好吧，我遇到了一个错误，但我认为这与 chrome 扩展的工作方式有关。我得调查一下：

拒绝执行内联事件处理程序，因为它违反了以下内容安全策略指令：“script-src 'self' blob: filesystem: chrome-extension-resource:”。启用内联执行需要“unsafe-inline”关键字、哈希（“sha256-...”）或随机数（“nonce-...”）。

【问题讨论】：

对不起，我对您的确切问题有点困惑。你觉得你能澄清一下吗？您是在询问 Chrome 扩展程序吗？
@BurningLights 我在问我是否可以在我的 html 中使用 onClick 和 onChange 还是已弃用？
根据 MDN (developer.mozilla.org/en-US/docs/Web/Guide/HTML/…) 应该避免事件属性。但是，我找不到任何关于它们被弃用的信息。

标签： javascript jquery html dom

【解决方案1】：

听起来您正在编写 Google Chrome 扩展程序。您不能在用于扩展页面*的安全模型下使用任何内联事件处理程序（即onEvent 属性）。所有事件都必须通过 Javascript 代码设置，例如

document.getElementById("select").addEventListener("change", getValue);

或者，如果您使用的是 jQuery：

$("#select").change(getValue);

*：具体来说，the Content Security policy for Chrome extensions。

【讨论】：

Aww 好的，我不想只为一个选择框添加事件侦听器更改，但我想我必须这样做:)。现在，如果我没有制作 chrome 扩展程序，这在网页的在线世界中是否合法？使用 onEvent 属性？或者我可以添加一个小的提交按钮并使用与其他按钮相同的事件处理程序单击。
@ritchie “法律”是一个很难确定的词。无论如何，浏览器仍然支持内联事件处理程序，但通常不推荐。

【解决方案2】：

您可以在 html 中使用 onclick，并且您必须编写一个 onclick 将执行的 JavaScript 函数。使用 onclick 不需要 jQuery，你可以做纯 javascript。

HTML

<button onclick="foo()">Do something</button>
<p id="foo"></p>

function foo() {
    document.getElementById("foo").innerHTML = "Foo";
}

【讨论】：