1

我正在尝试 Ryan Fioravanti 的延迟 JavaScript 执行的整洁技术。他在 Google I/O 上的演示文稿的幻灯片 27和幻灯片 28 对此进行了描述。

在 WebKit 浏览器中，它工作得很好，提供了比仅仅将script标签放在页面底部或使用async属性更好的结果。

但是，它在 Firefox 或 IE 中不起作用。我可以在 Firebug 中看到脚本被插入到 DOM 中，但我也可以在 Firebug 中看到脚本本身从未被执行。

外部脚本<script src="..."></script>（如 <script>//inline code goes here</script>.

有没有人让这种技术在非 WebKit 浏览器中工作？

这是复制问题的相关源代码：

<script type="text/notJs">
    alert('This alert will show in Chrome and Safari thanks to the DOM manipulation below! But it does not show in Firefox or IE.');
</script>
<script>
    window.onload = function () {
        var scripts = document.getElementsByTagName('script');
        var scriptIndex = 0;
        for (var i = 0, len = scripts.length; i < len; i++) {
            var scriptEl = scripts[scriptIndex];
            if (scriptEl.type === 'text/notJs') {
                scriptEl.type = 'text/javascript';
                scriptEl.parentNode.removeChild(scriptEl);
                document.body.appendChild(scriptEl);
            } else {
                scriptIndex++;
            }
        }
    };
</script>
4

1 回答 1

0

以下代码似乎适用于 Firefox、IE、Safari 和 Chrome。它适用于内联脚本和外部脚本。

<script>
    window.onload = function () {
        var scripts = document.getElementsByTagName('script'),
            scriptIndex = 0,
            newScript,
            scriptEl;
        for (var i = 0, len = scripts.length; i < len; i++) {
            scriptEl = scripts[scriptIndex];
            if (scriptEl.type === 'text/notJs') {
                scriptEl.parentNode.removeChild(scriptEl);
                newScript = document.createElement('script');
                newScript.type = "text/javascript";
                if (scriptEl.text) {
                    newScript.text = scriptEl.text;
                } else {
                    newScript.src = scriptEl.src;
                }
                document.body.appendChild(newScript);
            } else {
                scriptIndex++;
            }
        }
    };
</script>
于 2012-07-11T20:49:01.857 回答