Safari 和 Chrome 不会评估动态添加的
我正在编写小的 JavaScript 代码，它将在 html 页面加载时加载外部 js 文件。
我测试了2种方法。
情况1：使用document.write添加
情况2：使用 DOMElement.appendChild 添加
仅适用于 IE、FF 和 Opera。不适用于 Safari 和 Chrome。
在这两种情况下，我都期望新的
但它不适用于 Safari 和 Chrome。
谁能告诉这是否应该起作用？谢谢。
<html>
<head>
<title>JavaScript loading test</title>
<script type="text/javascript">
var success = false;
window.onload = function()
{
document.getElementById("result").innerHTML = success? "OK": "ERROR!";
}
// TEST CASE 1.
// Works for all browsers.
document.write('<script type="text/javascript" src="foo.js"></' + 'script>');
// TEST CASE 2.
// Only works for Opera, FireFox, Opera.
// var scriptElem = document.createElement("script");
// scriptElem.setAttribute("type", "text/javascript");
// scriptElem.setAttribute("src", "foo.js");
// var headElem = document.getElementsByTagName("head")[0];
// headElem.appendChild(scriptElem);
</script>
<!-- expected new scrip tag being inserted here. -->
</head>
<body>
Testing...<br/>
<span id="result"></span>
</body>
</html>
“foo.js”只是一行代码。
success = true;
I am writing small JavaScript code which will load external js files at html page loading.
I tested 2 ways.
Case 1: Used document.write to add <script> tag.
It worked for all browsers (IE, FF, Safari, Chrome, Opera).
Case 2: Used DOMElement.appendChild to add <script> tag to the <haed> element.
Only worked for IE, FF, and Opera. Did NOT work for Safari and Chrome.
In both cases, I expected new <script> tag is being inserted before <head> closing tag.
So the new <script> tag is evaluated before processing <body>, and by the time window.onload is called, "success" variable should be true.
But it wasn't for Safari and Chrome.
Can anyone tell if this should or shouldn't work? Thank you.
<html>
<head>
<title>JavaScript loading test</title>
<script type="text/javascript">
var success = false;
window.onload = function()
{
document.getElementById("result").innerHTML = success? "OK": "ERROR!";
}
// TEST CASE 1.
// Works for all browsers.
document.write('<script type="text/javascript" src="foo.js"></' + 'script>');
// TEST CASE 2.
// Only works for Opera, FireFox, Opera.
// var scriptElem = document.createElement("script");
// scriptElem.setAttribute("type", "text/javascript");
// scriptElem.setAttribute("src", "foo.js");
// var headElem = document.getElementsByTagName("head")[0];
// headElem.appendChild(scriptElem);
</script>
<!-- expected new scrip tag being inserted here. -->
</head>
<body>
Testing...<br/>
<span id="result"></span>
</body>
</html>
"foo.js" is just one line of code.
success = true;
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
当你的 javascript 被评估时，DOM 还没有完全构建，head 元素甚至还没有完成。在 HTML 页面完全加载之前，您通常无法访问或操作 DOM（
getElementsByTagName和appendChild等）。At the time when your javascript is evaluated, the DOM isn't fully built, the head element is not even finished. You normally cannot access or manipulate the DOM (
getElementsByTagNameandappendChild, etc. ) before the HTML page is fully loaded.试试这个：
但是将其放在 BODY 标记开头的 SCRIPT 标记中
Try this instead:
But place this in a SCRIPT tag at the beginning of the BODY tag