Question

来from this answer说：

您应该在src事件之后设置onload属性，f.ex：

el.onload = function() { //... el.src = script;

您还应该在附加onload事件之前将脚本附加到DOM ：

$body.append(el); el.onload = function() { //... el.src = script;

请记住，您需要检查readystate是否支持IE。如果您使用的是jQuery，还可以尝试getScript()方法：http://api.jquery.com/jQuery.getScript/

我对相信这是问题的正确答案持怀疑态度。

那么，设置onload处理程序和src的顺序是如此重要吗？我认为它们是由浏览器立即评估的，所以我认为之间没有区别：

el.onload = function() { //... el.src = script;

和

el.src = script; el.onload = function() { //...

我是对的吗？

Answer 1

是＆＃39; el＆＃39;已经是你的直播DOM的一部分？如果是这样，当您更改其onload事件处理程序时，将不会评估它的内容（因为已经发生了加载事件）。

el.onload = function（）{//...

如果el尚未添加到页面中，例如，如果您正在构建视图，并且在设置完所有内容后将注入到页面中，那么它的加载事件将被触发它被添加到页面中。

谨慎对待src＆＃39;可能取决于＆＃39; onload＆＃39;。

中发生的事情

Answer 2

@thinkbigthinksmall是对的。

我想补充一点，这种行为是特定于webkit的，Firefox会对事件处理程序进行排队，因此在这种情况下无关紧要。

我不确定规格对此有什么说法，但IMM FF行为是正确的。

无论如何，由于webkit的行为与此类似，因此在声明onload事件之后应始终设置src，否则，缓存的媒体将在解析脚本之前触发onload事件。

一种解决方法是在声明onload事件后再次设置src：

<img src="someCachedMedia.ext" id="img"/>
<script>
  img.onload = doStuff;
  img.src = img.src; // force the onload to fire again
</script>

这样，您确定onload事件将会触发。此外，应该进行单个请求，因为第一个请求将被缓存。

onload handler和src的顺序在脚本元素中是否重要？

2 个答案: