1

我想给随机网站一个最小的 js 代码，以便他们可以添加一个小部件。

代码需要在主页加载后运行，并包含一个带有域名的参数。（我不想硬编码）

一种选择是在之前添加此代码</body>（因此它将在页面加载后运行）：

<script type="text/javascript" id="widget_script">  
    document.getElementById('widget_script').src=location.protocol.toLowerCase()+"//mywebsite.com/?u="+encodeURIComponent(window.location.host);        
</script>

这适用于 IE，但不适用于 Firefox。我在 Firebug 中看到 src 属性已正确创建，但我的站点中的脚本未加载。

我的问题是：最好的方法是什么？（最好在标题部分放置最少的行。）

为了进一步澄清这个问题：如果我在标题部分放了一个脚本，我如何让它在加载并加载主页后运行？如果我在脚本中使用 onload 事件，我可能会错过它，因为它可能会在 onload 事件触发后加载。

4

3 回答 3

2

您可以尝试使用 document.write 静态包含脚本（这是一种较旧的技术，不建议使用，因为它可能会导致更现代的库出现问题）：

var url = location.protocol.toLowerCase() + 
    "//mywebsite.com/?u="+encodeURIComponent(window.location.host);
document.write('<script src="', url, '" type="text/javascript"><\/script>');

或者使用动态创建的 DOM 元素：

var dynamicInclude = document.createElement("script");
dynamicInclude.src = url;
dynamicInclude.type = "text/javascript";
document.getElementsByTagName("head")[0].appendChild(dynamicInclude);

后期编辑：

为了确保脚本在 onload 之后运行，可以使用： 

var oldWindowOnload = window.onload; 
window.onload = function() {
    oldWindowOnload(); 
    var url = location.protocol.toLowerCase() + 
        "//mywebsite.com/?u="+encodeURIComponent(window.location.host);
    var dynamicInclude = document.createElement("script");
    dynamicInclude.src = url;
    dynamicInclude.type = "text/javascript";
    document.getElementsByTagName("head")[0].appendChild(dynamicInclude); 
}

I do not believe it can be shorter than this, apart from shorter variable names :)

于 2009-02-09T10:27:38.973 回答
1

为什么不使用 jQuery 的getScript方法来进行加载呢？如果你不想依赖 jQuery，你可以通过源代码来了解他们是如何解决它的。

查看广泛使用的库总是会向您展示您不知道自己遇到的问题的解决方案。例如，您可以看到 jQuery 如何在脚本加载时生成回调，以及它如何避免 IE 中所谓的内存泄漏。

于 2009-02-09T10:23:08.017 回答
0

您可能想要实现非阻塞脚本技术。本质上，您将创建并附加一个全新的脚本元素，而不是修改脚本的 src。

在这里写得很好，在 YUI 和 jQuery 中有标准的方法可以做到这一点。这很简单，只有一个很好理解的问题（并在该链接中记录）。

哦，还有这个：

一种选择是在之前添加此代码</body>（因此它将在页面加载后运行）：

...在技术上并不正确：您只是将脚本放在加载顺序中的最后一件事。

于 2009-02-09T10:18:20.557 回答