动态加载外部 JS 并将响应写入 div答案

【问题标题】：dynamically load external JS and write response to a div动态加载外部 JS 并将响应写入 div
【发布时间】：2011-04-11 16:22:20
【问题描述】：

我在我的页面中嵌入了一个美味的提要。当我只是在 div 中添加脚本标签时，它显然会在我的 JS 的其余部分之前加载（在页面底部）。我想在所有其他 js 加载完成后，将此脚本动态加载到指定的 div 中。

我已经尝试过 getscript 函数，但是当我将它与 .html() 一起使用时它肯定会破坏页面：

$('#delicious').html(function(){
$.getScript("http://feeds.delicious.com/v2/js/bayonnebridge?title=My%20Delicious%20Bookmarks&icon=m&count=5&sort=date&tags&extended&name&showadd"); 
});

我似乎无法理解如何将该文件的结果打印到#delicious div 中。

【问题讨论】：

标签： javascript jquery html load

【解决方案1】：

如果要在div中显示脚本，不应该是这样，利用回调函数吗？

$.getScript("http://feeds.delicious.com/v2/js/bayonnebridge?title=My%20Delicious%20Bookmarks&icon=m&count=5&sort=date&tags&extended&name&showadd", 
             function(data){
                $('#delicious').html(data);
            });

$.getScript() 的结果是 XMLHTTPRequest 对象，您似乎想要的是响应文本。

此外，您给出的 URL 的响应似乎试图将脚本写入文档，从而覆盖您的所有页面内容。这是您的问题，您可以考虑使用iframe 并将此 URL 设置为其来源。

根据脚本是跨域加载还是从同一个域加载，我似乎也有不同的行为——我不太确定该怎么做，因为getScript() 应该可以跨域工作。

【讨论】：

是的，我真的很困惑。将脚本内联工作得非常好（不会覆盖整个页面），我认为 getscript 会执行类似的操作。我可能只需要承受性能损失。

【解决方案2】：

听起来您想使用诸如窗口加载事件之类的东西。尝试添加如下所示的处理程序：

$(window).load(function() {
  var script = document.createElement('script');
  script.type = 'text/javascript';
  script.src = "http://feeds.delicious.com/v2/js/bayonnebridge?title=My%20Delicious%20Bookmarks&icon=m&count=5&sort=date&tags&extended&name&showadd";
  $('#delicious').append(script);
});

查看jQuery .load() API 了解更多信息。

【讨论】：

这会产生相同的结果 - 页面加载，但是当它点击这个 js 时，它会重新加载整个页面并尝试用 url 填充它。太奇怪了。
我忽略了你的 .html() 使用；您肯定想要响应，并且可以像示例一样动态附加脚本。（不过，no.good.at.coding 似乎有你的答案。）祝你好运！
这篇文章或许对你也有帮助：stackoverflow.com/questions/4520440/…
谢谢，早上去试试。感谢您的帮助！