我有一个包含 4 个 iframe 的页面,并且所有页面都添加了相同的 javascript。当页面加载时,我发现从服务器加载了 5 次相同的 javascript。然后我在父页面中加载 javascript 时设置所有 iframe 加载,但得到相同的结果,为什么?
父页面的代码:
<html> <head> </head> <body> <iframe></iframe> <iframe></iframe> <iframe></iframe> <iframe></iframe> </body> <script> var newScript = document.createElement("script"); newScript.src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.1/jquery.min.js"; var srcs = ["html1.html", "html2.html", "html3.html", "html4.html"]; document.getElementsByTagName("HEAD").item(0).appendChild(newScript); newScript.onload = newScript.onreadystatechange = function () { console.log("jquery.min.js loaded"); var iframes = document.getElementsByTagName("iframe"); for (var i = 0; i < iframes.length; i++) { var id = i; iframes[id].src = srcs[id]; } } console.log("init"); </script> </html>
所有 iframe 页面中的代码:
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=8"> <meta http-equiv="Expires" content="0"> <meta http-equiv="Pragma" content="no-cache"> <meta http-equiv="Cache-control" content="no-cache"> <meta http-equiv="Cache" content="no-cache"> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> </head> <body> html1 </body> </html>
图片:DevTool 网络: