javascript 将 <Script> 标签附加到正文？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/31585832/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Append <Script> Tag to Body?
提问by confile
I want to append a script tag to the body of my HTML page. I added the following in my page:
我想在 HTML 页面的正文中附加一个脚本标记。我在我的页面中添加了以下内容：
<script type="text/javascript">
function loadScript() {
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'https://maps.googleapis.com/maps/api/js?sensor=false&' +
'callback=initialize';
document.body.appendChild(script);
}
window.onload = loadScript;
</script>
I tried to run it in JSFidleand there where no problems.
我试图在JSFidle 中运行它，那里没有问题。
When I run it on my html page which runs on a demo server I get the following error in the console:
当我在演示服务器上运行的 html 页面上运行它时，我在控制台中收到以下错误：
Uncaught TypeError: undefined is not a function
What causes this error and how can I prevent it?
导致此错误的原因是什么，我该如何预防？
Edit: Removing the type text/javascript does not change anything.
编辑：删除类型 text/javascript 不会改变任何内容。
回答by Tasos K.
The error you are getting is because there is no initialize()function. If you declare one there will be no error.
你得到的错误是因为没有initialize()功能。如果你声明一个，就不会有错误。
function loadScript() {
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'https://maps.googleapis.com/maps/api/js?sensor=false&callback=initialize';
document.body.appendChild(script);
console.log('loadScript');
}
function initialize() {
console.log('initialize');
}
window.onload = loadScript;
回答by Quentin
I tried to run it in JSFidle and there where no problems.
我试图在 JSFidle 中运行它，那里没有问题。
Incorrect. On JSFiddle you have a differentproblem.
不正确。在 JSFiddle 上，您遇到了不同的问题。
There you run your code when the document load event fires. That code defines a function and assigns an event handler for the document load event. Since that event has already fired, the function never runs. You don't get an error because the code doesn't get as far as it does when you test in your standalone document.
当文档加载事件触发时，您可以在那里运行您的代码。该代码定义了一个函数并为文档加载事件分配了一个事件处理程序。由于该事件已经触发，该函数永远不会运行。您不会收到错误，因为代码不会像您在独立文档中测试时那样深入。
When I run it on my html page which runs on a demo server I get the following error in the console:
当我在演示服务器上运行的 html 页面上运行它时，我在控制台中收到以下错误：
In this case, the code is running successfully.
在这种情况下，代码运行成功。
The load event fires. The loadScript function runs. The script element is appended to the page. Google's script runs.
加载事件触发。loadScript 函数运行。脚本元素被附加到页面。谷歌的脚本运行。
You get an error because you said:
你得到一个错误，因为你说：
'callback=initialize'
'callback=initialize'
So the script you are requesting from Google tries to call initialize(), but you haven't defined that function so you get an error instead.
因此，您从 Google 请求的脚本尝试调用initialize()，但您尚未定义该函数，因此您会收到错误消息。
See also the documentationwhich includes this example:
另请参阅包含此示例的文档：
function initialize() {
var mapOptions = {
zoom: 8,
center: new google.maps.LatLng(-34.397, 150.644)
};
var map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
}
function loadScript() {
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp' +
'&signed_in=true&callback=initialize';
document.body.appendChild(script);
}
window.onload = loadScript;
