Question

我们有一个网站，该网站应该加载由第三方提供的徽标（徽标是一个链接，允许用户查看我们的网站已被该第三方验证。）

要使其正常工作，我们被告知在头中包含一个简短的脚本

INSERT INTO metric(name) VALUES( 'loopcnt');
INSERT INTO metric_value( name, val, metric_id) VALUES ( 'tst1', '0.01', (SELECT MAX(metric_id) FROM metric));
INSERT INTO metric_value( name, val, metric_id) VALUES ( 'tst2', '0.41', (SELECT MAX(metric_id) FROM metric));

INSERT INTO metric(name) VALUES( 'timed');
INSERT INTO metric_value( name, val, metric_id) VALUES ( 'tst1', '0.71', (SELECT MAX(metric_id) FROM metric));
INSERT INTO metric_value( name, val, metric_id) VALUES ( 'tst2', '0.46', (SELECT MAX(metric_id) FROM metric));

体内还有另一个脚本：

<script type="text/javascript"> 
    //<![CDATA[ 
    var tlJsHost = ((window.location.protocol == "https:") ? 
        "https://secure.comodo.com/" : "http://www.trustlogo.com/");
    document.write(unescape("%3Cscript src='" + tlJsHost + 
        "trustlogo/javascript/trustlogo.js' 
        type='text/javascript'%3E%3C/script%3E"));
    //]]>
</script>

这一切都很好，最初：加载外部脚本，运行函数，显示徽标。完美。

当远程站点变得非常慢时发生了问题...由于脚本同步运行，因此加载此徽标的所有页面也突然变得非常慢。

理想情况下，我希望它可以像设计为ajax类型调用一样工作...加载页面，并在页面加载后尝试加载额外的内容。

我已经尝试了异步/延迟和ajax之类的组合，但是由于JS使用的是document.write，因此如果页面已完全加载，则document.write会先吹走现有文档写入新数据；页面加载...然后消失，徽标出现。（我看到一些评论解释说，在页面加载后使用document.write时，这是预期的行为。）

有没有办法做到这一点？有我不考虑的替代路径吗？

Answer 1

看https://secure.comodo.com/trustlogo/javascript/trustlogo.js，TrustLogo函数本身使用document.write（间接地，代码被最小化了，但最终还是使用了），这意味着您不能异步使用这些脚本。如果使第一个脚本异步并以另一种方式附加该JavaScript文件，则必须使第二个脚本异步，这意味着document.write（在TrustLogo函数内）将在main之后被调用。 HTML解析已完成，这意味着将存在一个隐式document.open，这将擦除您的页面。：-（

当然...您可以将所有这些内容放在主页上的iframe中，以便仅影响iframe，而不影响整个页面。前提是不违反徽标使用条款（显然，您会为iframe使用相对路径，以便其代码能看到正确的域等）。

Answer 2

好吧！所以看来我已经找到了这个方法。但是，我对此有些怀疑。请按照以下步骤操作：

您首先需要保存head标记的innerHTML，以便document.write()不会清除您的CSS和其他js文件。您可以这样操作：var head = document.head.innerHTML;。
然后像document.write(document.body.innerHTML);一样做一个虚拟document.write。
第2步将重新渲染您的页面而无需样式设置，因为它还会删除包含所有css和js文件的head标记的内容。但是，您可以通过运行在步骤1中保存的document.head.innerHTML = head;保留所有内容。
现在，您将页面恢复原状，任何其他document.write（）都不会再擦除您的页面。甚至没有TrustLogo功能。它将全部添加到body标记的末尾。

使用document.write异步运行外部JS函数

2 个答案: