Question

任何人都可以解释当您使用javascript插入基于javascript的小部件时会发生什么？

这是我的js代码：

var para = document.getElementsByTagName("p");
var cg = document.createElement("div");
cg.setAttribute("class", "twt");
cg.innerHTML='<a href="http://twitter.com/share" class="twitter-share-button" 
data-count="vertical" data-via="xah_lee">Tweet</a>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>';
document.body.insertBefore(cg, para[1]);

它在第一段之前插入了推特小部件。正如您在上面所看到的，twitter小部件需要一个javascript来显示页面被推文的时间。

在Firefox，Chrome中无效，但在IE8中无法正常工作。发生这种情况时，预期的行为应该是什么？新插入的js代码是否应该执行？如果是这样，它与页面本身的代码有何不同？

Answer 1

为了执行您通过innerHTML插入DIV的JS代码，您需要执行以下操作（由Yuriy Fuksenko提供http://www.coderanch.com/t/117983/HTML-JavaScript/Execute-JavaScript-function-present-HTML）

function setAndExecute(divId, innerHTML) {  
    var div = document.getElementById(divId);  
    div.innerHTML = innerHTML;  
    var x = div.getElementsByTagName("script");   
    for (var i=0;i<x.length;i++) {  
        eval(x[i].text);  
    }  
}

这里有一个稍微更高级的方法：http://zeta-puppis.com/2006/03/07/javascript-script-execution-in-innerhtml-the-revenge/ - 查找<script>代码，获取其内容并在<head>中创建新元素。

Answer 2

innerHTML无法插入脚本标记（因为在大多数浏览器中，链接脚本无法执行）。实际上，您应该在服务器端插入一次脚本标记insert only the link at the location of each post（也就是说，如果要将其添加到显示多个帖子的博客主页，每个帖子都有自己的URL）。

如果由于某种原因，您决定必须使用一段JavaScript代码来完成所有操作，至少以一种可行的方式导入推文按钮脚本，例如{{ 3}}或the Google Analytics way（查找importScriptURI函数）。（请注意，我不知道推文按钮的具体细节，因此它甚至可能无法正常工作。）

当你使用javascript插入一个javascript小部件时会发生什么？

2 个答案: