Question

我有一些代码可以动态插入<script type="text/javascript">块。

这个块包含一个函数，它上面有一个<input type="button">元素（也是动态插入的），用onclick属性调用它。

然而，它不起作用，Firebug说我尝试点击按钮时没有定义该功能。

这是否可以预期，如果有，是否有解决方法？

Answer 1

如果你将它写入innerHTML属性，it won't work除了在IE中存在DEFER属性时：

scriptParentNode.innerHTML = '<span/><script defer="defer" type="text/javascript">blah();</script>';

您的选择是，a）使用DOM创建元素并附加它：

var head = document.getElementsByTagName("head")[0];
var sTag = document.createElement("script");
sTag.type = "text/javascript";
sTag.text = "blah();";
head.appendChild(sTag);

或b）在解析HTML时使用document.write（但不是之后！）

<head>
  <script type="text/javascript">
    document.write('<script type="text/javascript">blah();</script>');
  </script>
</head>

修改

由于有关延迟属性不正确的信息，因为我显然，我认为有必要从MSDN documentation发布一个工作示例。虽然IE确实从innerHTML字符串的开头删除了NoScope元素，但是可以通过在HTML字符串的开头添加一个范围元素来解决这个问题（上面更新的示例）：

<HTML> <SCRIPT> function insertScript(){ var sHTML="<input type=button onclick=" + "go2()" + " value='Click Me'><BR>"; var sScript="<SCRIPT DEFER>"; sScript = sScript + "function go2(){ alert('Hello from inserted script.') }"; sScript = sScript + "</SCRIPT" + ">"; ScriptDiv.innerHTML = sHTML + sScript; } </SCRIPT> <BODY onload="insertScript();"> <DIV ID="ScriptDiv"></DIV> </BODY> </HTML>

请随意点击MSDN文档中的“显示我”按钮以获取工作示例。 [link]

Answer 2

如果您使用的是

document.getElementById('foo').innerHTML = blah

然后不，它不会起作用。

一个简单的解决方法是使用jQuery进行插入，将执行该块中的脚本。只需在元素上使用html函数，将其传递给HTML /脚本块。

Answer 3

动态插入客户端还是服务器端？

服务器端它将工作 - 假设服务器端调用不是AJAX回发（因此实际上实际的动态插入仍然是客户端）。

客户端它不会（你不能简单地将java脚本注入已经加载的页面并期望它执行）。在这种情况下，您必须实际显式执行JavaScript，或者使用像jQuery这样的框架来为您执行此操作。

动态插入<script>标签是否有效？</script>

3 个答案: