Javascript 如何在DOM结构中加载动态JS代码？

我有一个HTML with JS元素，需要在运行时加载

以下是一些示例文件，以说明我正在寻找的功能

文件1:index.html

<div id="mydiv"> </div>
<script type="text/javascript">
   xmlhttp=new XMLHttpRequest();
   xmlhttp.open("GET","script.php",false);
   xmlhttp.send();
   var text=xmlhttp.responseText;
   var elem=document.getElementById("mydiv")
   elem.innerHTML=text
   func() 
</script>    

xmlhttp=新的XMLHttpRequest（）；
open（“GET”，“script.php”，false）；
xmlhttp.send（）；
var text=xmlhttp.responseText；
var elem=document.getElementById（“mydiv”）
elem.innerHTML=文本
func（）

文件2:script.php

<script type="text/javascript">
   function func(){
       alert("func")
   }
</script>

函数func（）{
警报（“func”）
}

浏览器返回的错误：

内联脚本线程
未捕获异常：引用错误：未定义 变量：中第20行第0列抛出func错误 localhost/my_project/： func（）

---

.innerHTML

不执行html中的脚本元素

试试这个：

xmlhttp=new XMLHttpRequest();
xmlhttp.open("GET","script.php",false);
xmlhttp.send();
var text=xmlhttp.responseText;

var root = document.createElement("div");
root.innerHTML = text;
var scripts = root.getElementsByTagName("script");

for( var i = 0; i < scripts.length; ++i ) {
    var code = scripts[i].innerText || scripts[i].textContent || scripts[i].innerHTML || "";
    eval(code);
}

func();

xmlhttp=newxmlhttprequest（）；
open（“GET”，“script.php”，false）；
xmlhttp.send（）；
var text=xmlhttp.responseText；
var root=document.createElement（“div”）；
root.innerHTML=文本；
var scripts=root.getElementsByTagName（“脚本”）；
对于（变量i=0；i