Safari и Chrome не оценивают динамически добавляемый тег <script> при загрузке страницы
Я пишу небольшой код JavaScript, который будет загружать внешние файлы JS при загрузке HTML-страницы.
Я проверил 2 способа.
Случай 1: Использовал document.write для добавления тега <script>. Это работало для всех браузеров (IE, FF, Safari, Chrome, Opera).
Случай 2: Использовал DOMElement.appendChild для добавления тега <script> в элемент <haed>.
Работал только для IE, FF и Opera. НЕ работал для Safari и Chrome.
В обоих случаях я ожидал, что новый тег <script> будет вставлен перед закрывающим тегом <head>. Таким образом, новый тег <script> оценивается перед обработкой <body>, и к тому времени, когда вызывается window.onload, переменная success должна иметь значение true.
Но это было не для 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;