Question

在网站中我用JavaScript编写动态添加的iframe的内容。将内容添加到iframe后，将执行iframe中的JavaScript。不幸的是IE存在差异。 IE（8-11）将首先执行内联JavaScript，然后执行外部脚本，即使它们位于内部脚本之前。这很奇怪，因为正常的过程是JavaScript将逐步同步加载。

示例：

我的网页：

<!DOCTYPE html SYSTEM "about:legacy-compat">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=8" />
        <meta charset="UTF-8">
        <title>
            TEST
        </title>
    </head>
    <body>
        <iframe name="testFrame" frameborder="0"></iframe>
        <script type="text/javascript" src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function(){
                var $iframe = $("iframe");

                // Data
                var data = "<!doctype html><html><head>";
                data += '<scrip'+'t type="text/javascript" src="test1.js"><'+'/script>';
                data += '<scrip'+'t type="text/javascript">console.log("Inline");<'+'/script>';
                data += "</head><body>TEST</body></html>";

                // Write in frame
                var dstFrame = $iframe[0];
                var dstDoc = dstFrame.contentDocument || dstFrame.contentWindow.document;
                dstDoc.write(data);
                dstDoc.close();
            });
        </script>
    </body>
</html>

test1.js将只记录一个示例状态，以查看将首先执行哪种日志：

console.log("EXTERNAL");

在Firefox中，控制台将是：

"EXTERNAL" test1.js:1
"Inline" test.html:1
"EXTERNAL" test1.js:1
"Inline" test.html:1

在IE中，控制台将是：

EXTERNAL
Inline
Inline
EXTERNAL

正如您所看到的那样内联内容将在外部之前执行，即使外部之前已添加到iframe中！

有人可以告诉我为什么以及如何避免它？

注意：您可以忽略前两个控制台日志，因为解析器将记录JavaScript，即使它在字符串中（在我的示例中它位于字符串内）。

IE在动态iframe内容之前在外部执行内联脚本

0 个答案: