Question

我正在尝试使用script id="img"标记解决问题。我在两个不同的页面上使用下面的两个脚本，但在这两种情况下脚本都没有加载。

在第一个例子中，IFRAMES在5秒和8秒后完全加载，在第二个例子中5秒后都加载，我也想加载js文件，但是它们没有被加载。

有人可以帮我吗？我需要添加/修改代码才能使其工作？提前谢谢。

示例1

<script type="text/javascript">
window.onload = function() {
    setTimeout(function(){loadfunction('map','https://www.example1.com/maps/')},5000);
    setTimeout(function(){loadfunction('fbook','https://www.example2.com/')},8000);
    setTimeout(function(){loadfunction('img','https://www.mywebpage.com/img.js')},10000);
}
function loadfunction(id,url) {
    document.getElementById(id).src = url;
} 
</script>

下面的脚本做同样的事情，但是在5秒内同时加载它们，而不是img.js文件，只有iframe。

示例2

<script type="text/javascript">
  window.onload = function() {
    setTimeout(loadfunction,5000)
 }
 function loadfunction() {
    document.getElementById("map").src = "https://www.example1.com/maps/"
    document.getElementById("fbook").src = "https://www.example2.com/"
    document.getElementById("img").src = "http://www.mywebpage.com/img.js"
 }
</script>

在两页的正文中我都有以下代码....

<iframe id="map" width="730" height="400" frameborder="0" style="border:0" allowtransparency="true"></iframe> 
<iframe id="fbook" width="730" height="400" frameborder="0" style="border:0" allowtransparency="true"></iframe>
<script id="img" type="text/javascript"></script>

Answer 1

脚本按照它们在HTML代码中出现的顺序执行。如果省略src，则script标记之间的内容将被解析为脚本。如果src存在，则加载脚本，并忽略标记之间的内容。

无论哪种方式，都不能在解析后更改脚本的内容。

最好的方法是创建一个新的脚本元素并为其赋予src属性，如window.onload处理函数中所示：

setTimeout(function () {
    var script = document.createElement('script');
    script.src = 'https://www.mywebpage.com/img.js';
    document.body.appendChild(script);
}, 10000);

外部javascripts延迟加载。 SCRIPT src属性不起作用？只有IFRAME src有效

1 个答案: