动态地将javascript插入到使用document.write的HTML中

我目前正在加载一个灯箱样式弹出窗口,从XHR调用加载它的HTML.然后,此内容将以"模态"弹出窗口显示.element.innerHTML = content这就像魅力一样.

在本网站的另一部分,我使用Flickr'徽章'(http://www.elliotswan.com/2006/08/06/custom-flickr-badge-api-documentation/)动态加载flickr图像.这样做包括一个加载flickr javascript的脚本标记,后者又会执行一些document.write语句.

当它们包含在HTML中时,它们都可以完美地工作.只有在灯箱内加载flickr徽章代码时,才会呈现内容.看起来使用innerHTML编写document.write语句太过分了,但是我在这个行为的javascript实现(FF2&3,IE6&7)中找不到任何线索.

任何人都可以澄清这是否应该起作用？谢谢.

通常,使用innerHTML时不会执行脚本标记.在你的情况下,这很好,因为document.write调用将消除页面中已有的所有内容.但是,这使得没有任何HTML document.write应该添加.

jQuery的HTML操作方法将为您执行HTML脚本,然后捕获调用document.write并在适当的位置获取HTML.如果它足够简单,那么这样的事情会做:

var content = '';
document.write = function(s) {
    content += s;
};
// execute the script
$('#foo').html(markupWithScriptInIt);
$('#foo .whereverTheDocumentWriteContentGoes').html(content);

虽然这很复杂.如果脚本在另一个域上,它将异步加载,因此您必须等到完成后才能获取内容.另外,如果它只是将HTML写入片段的中间而没有可以轻松选择的包装元素呢？writeCapture.js (完全披露:我写了)处理所有这些问题.我建议只使用它,但至少你可以查看代码,看看它如何处理所有事情.

编辑:这是一个页面,展示你想要的效果.

我创建了一个简单的测试页面来说明问题：

该页面会警告“ bar”并显示“ foo”，而我希望它也能警告“ foo”并显示“ bar”。但是，不幸的是，由于该script标记是一个较大的HTML页面的一部分，因此我无法像上面的示例一样单独选择该标记并附加它。好吧，我可以，但是这需要扫描标签的innerHTML内容script，并用占位符将其替换为字符串，然后使用DOM插入它们。听起来并不那么琐碎。