Safari和Chrome不评估动态添加的< script>页面加载时标记 [英] Safari and Chrome doesn't evaluate dynamically added <script> tag at page load
问题描述
我正在编写小型JavaScript代码，它将在html页面加载时加载外部js文件。
I am writing small JavaScript code which will load external js files at html page loading.
我测试了两种方式。
案例1：使用document.write添加< script>标签。
适用于所有浏览器（IE，FF，Safari，Chrome，Opera）。
Case 1: Used document.write to add <script> tag. It worked for all browsers (IE, FF, Safari, Chrome, Opera).
案例2：已使用DOMElement.appendChild添加< script>标记为< haed>元素。
Case 2: Used DOMElement.appendChild to add <script> tag to the <haed> element.
仅适用于IE，FF和Opera。不适用于Safari和Chrome。
Only worked for IE, FF, and Opera. Did NOT work for Safari and Chrome.
在这两种情况下，我都期待新的< script>正在< head>之前插入标记结束标签。
所以新的< script>在处理< body>之前评估tag，并且在调用window.onload时，success变量应为true。
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.
但它不适用于Safari和Chrome。
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只是一行代码。
"foo.js" is just one line of code.
success = true;
推荐答案
试试这个：
var s = document.createElement('SCRIPT');
s.charset = 'UTF-8';
s.src ='foo.js';
document.getElementsByTagName('HEAD')[0].appendChild(s);
但请将其放在BODY标签开头的SCRIPT标签中
But place this in a SCRIPT tag at the beginning of the BODY tag
这篇关于Safari和Chrome不评估动态添加的< script>页面加载时标记的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
