javascript - 重复注入(inject) Javascript 以进行 YouTube API 调用？

Question

我正在创建一个使用 YouTube API 的网页。我希望能够在每次用户执行某些操作并使用调用结果更新页面内元素时触发对 YouTube API 的 AJAX 样式调用。 YouTube 的文档建议使用 Javascript 注入(inject)来解决跨域权限问题，这些问题会涉及从我的网页对外部域 (gdata.youtube.com) 进行 AJAX 调用。例如:

<script 
    type="text/javascript" 
    src="http://gdata.youtube.com/feeds/users/GoogleDevelopers/uploads?alt=json-in-script&format=5&callback=showMyVideos">
</script>

这个放置在 HTML BODY 中的代码段从“GoogleDevelopers” channel 发出视频提要请求，并使用“callback”参数在调用返回时调用 showMyVideos()。 showMyVideos()(此处未显示且任意命名)使用 DOM 调用使用调用结果更新命名的 DIV。

我想做同样的操作，除了动态而不是像上面显示的那样静态。例如，我看到过这样的代码:

var s = document.createElement('script');
    s.type = "text/javascript";
    s.src = "http://gdata.youtube.com/feeds/users/GoogleDevelopers/uploads?alt=json-in-script&format=5&callback=showMyVideos"
    var head = document.getElementsByTagName('head')[0];
    head.appendChild(s);

我担心的是如果我使用这种方法，因为我将进行许多 AJAX 调用，我将在网页 DOM 树中积累越来越多的动态生成的 Javascript DOM 元素，我担心这可能会对浏览器造成什么后果或其他任何内容。

有没有办法以这种方式进行 Javascript 注入(inject)，而不会使 HEAD 元素与大量 Javascript 元素混淆？简洁的代码示例将不胜感激。

-- 罗施勒

Answer 1

好吧，没那么难，在您获得数据后，您可以通过删除脚本元素来清理。