JavaScript的onload与onmouseout事件代码无法执行问题求助

嘿，我来帮你排查下代码里的问题，这两个事件没正常运行其实都是有明确原因的，咱们一个个拆解：

1. onmouseout事件失效的问题 #

你在outFunction里写了document.getElementById("mouseout").alert("Don't Leave!")，但DOM元素本身并没有alert()方法——alert()是浏览器窗口（window对象）的专属方法，所以这里直接调用alert()就可以了。另外你的div标签里多了个多余的逗号：onmouseout="outFunction()" , id="mouseout"，这个逗号属于语法错误，得删掉才行。

2. div上的onload事件不生效的问题 #

<div>元素本身并不支持onload事件，这个事件通常用于<body>、<img>、<script>这类需要加载外部资源或者作为页面入口的元素。如果想在页面加载完成后修改这个div的内容，有两种常用方案：

方案一：监听window的load事件

把myFunction绑定到window.onload上，等整个页面（包括资源）加载完成后触发：

<script>
function outFunction() {
  alert("Don't Leave!");
}

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

// 页面加载完成后执行myFunction
window.onload = myFunction;
</script>

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

方案二：把脚本放在页面末尾

当浏览器解析到页面底部的脚本时，前面的DOM元素已经加载完成，直接修改内容即可：

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

<script>
function outFunction() {
  alert("Don't Leave!");
}

// 此时div#hi已经存在，直接修改内容
document.getElementById("hi").innerHTML = "This DIV is loaded.";
</script>

内容的提问来源于stack exchange，提问作者user13398128