从动态添加的脚本标记中获取内部 HTML

Get innerHTML from dynamically added script tag

本文关键字:获取 内部 HTML 动态 添加 脚本      更新时间:2023-09-26
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<script type="text/javascript" id="embeddedScript">
    var script = document.createElement("script");
    script.setAttribute("type", "text/javascript");
    script.setAttribute("id", "scriptData");
    script.src = "DynamicText.jsp";
    script.onload = function() {
        alert(x);
        alert(document.getElementById("scriptData"));
        alert(document.getElementById("scriptData").innerHTML);
        alert(document.getElementById("embeddedScript").innerHTML);
    };
    document.getElementsByTagName("head")[0].appendChild(script);
</script>
</body>
</html>

动态文本.jsp

x="Hello World!"

第一个警报给出Hello World!

第二个警报给出[Object HTMLScriptElement]

我预计第三个警报会给出 x="Hello World!" 但它显示一个空值。

但是对于第四个警报,我可以看到脚本标签内的整个文本,带有 id "embeddedScript"

原因?

您创建的 js 脚本标记scriptData其标记之间没有内容。它只是链接到要执行的 js 资源。它会看起来像这样

<script type="text/javascript" id="scriptData" src="DynamicText.jsp"></script>