Onload 和 onmouseout 事件的 Javascript 错误

【问题标题】：Javascript Error with Onload and onmouseout eventsOnload 和 onmouseout 事件的 Javascript 错误
【发布时间】：2020-08-30 10:03:21
【问题描述】：

我试图在 onmuseout/onload 事件发生时执行代码，但由于某种原因我的代码没有运行？？

function outFunction() {
  document.getElementById("mouseout").alert("Don't Leave!")
}

function myFunction() {
  document.getElementById("hi").innerHTML = "This DIV is loaded."
}

<div onmouseout="outFunction()" , id="mouseout">DIV</div>
<div id="hi" onload="myFunction()"></div>

【问题讨论】：

你希望document.getElementById("mouseout").alert("Don't Leave!") 做什么？
弹出警报，说“不要离开！”
如果您想显示警报，只需使用alert("Don't Leave!")。 alert 不是 getElementById 返回的 div 上的函数。

标签： javascript html function onload onmouseout

【解决方案1】：

输出函数：

alert 函数位于 window（或隐式 global 对象）上。它在返回的div 元素（它是HTMLDivElement 的一个实例）上不是。

把你的函数改成这样：

function outFunction() {
    window.alert("Don't Leave!")
}

请注意，这也有效（使用相同的alert 函数，因为window 是global 对象）：

function outFunction() {
    alert("Don't Leave!")
}

我的功能：

onload 未在 HTMLDivElement 上定义。你应该改用document.addEventListener( 'DOMContentLoaded', handler )。

将您的 HTML 和 JavaScript 函数更改为：

<div id="hi"></div>

function myFunction() {
    document.getElementById("hi").innerHTML = "This DIV is loaded."
}
document.addEventListener( 'DOMContentLoaded', myFunction ); // Do NOT put parentheses! i.e. don't put `myFunction()`, just put `myFunction` - because you're passing a function-reference, not a function-call.

【讨论】：