Javascript Динамический Script Загрузка IE проблем
Я пытаюсь загрузить динамически script с помощью этого кода:
var headID = document.getElementsByTagName("head")[0];
var script = document.createElement('script');
script.type='text/javascript';
script.src="js/ordini/ImmOrd.js";
script.setAttribute("onload", "crtGridRicProd();");
headID.appendChild(script);
Мне нужно запустить функцию crtGridRicPrdo() при запуске страницы, а в FireFox все работает нормально, но в Internet Explorer у меня проблемы!
Ответы
Ответ 1
Internet Explorer не поддерживает "onload" в тегах script, вместо этого он предлагает "onreadystatechange" (аналогично объекту xhr). Вы можете проверить его состояние следующим образом:
script.onreadystatechange = function () {
if (this.readyState == 'complete' || this.readyState == 'loaded') {
crtGridRicProd();
}
};
иначе вы можете вызвать crtGridRicProd() в конце вашего js файла
ИЗМЕНИТЬ
Пример:
test.js:
function test() {
alert("hello world");
};
index.html
<!DOCTYPE html>
<html>
<head>
<title>test</title>
</head>
<body>
<script>
var head = document.getElementsByTagName("head")[0] || document.body;
var script = document.createElement("script");
script.src = "test.js";
script.onreadystatechange = function () {
if (this.readyState == 'complete' || this.readyState == 'loaded') {
test();
}
};
script.onload = function() {
test();
};
head.appendChild(script);
</script>
</body>
вы увидите предупреждение в обоих браузерах!
Ответ 2
Я использую следующее для загрузки сценариев один за другим (async=false
):
var loadScript = function(scriptUrl, afterCallback) {
var firstScriptElement = document.getElementsByTagName('script')[0];
var scriptElement = document.createElement('script');
scriptElement.type = 'text/javascript';
scriptElement.async = false;
scriptElement.src = scriptUrl;
var ieLoadBugFix = function (scriptElement, callback) {
if ( scriptElement.readyState == 'loaded' || scriptElement.readyState == 'complete' ) {
callback();
} else {
setTimeout(function() { ieLoadBugFix(scriptElement, callback); }, 100);
}
}
if ( typeof afterCallback === "function" ) {
if ( typeof scriptElement.addEventListener !== "undefined" ) {
scriptElement.addEventListener("load", afterCallback, false)
} else {
scriptElement.onreadystatechange = function(){
scriptElement.onreadystatechange = null;
ieLoadBugFix(scriptElement, afterCallback);
}
}
}
firstScriptElement.parentNode.insertBefore(scriptElement, firstScriptElement);
}
Используйте его следующим образом:
loadScript('url/to/the/first/script.js', function() {
loadScript('url/to/the/second/script.js', function() {
// after both scripts are loaded
});
});
Одно исправление, которое включает script, - это ошибка латентности для IE.
Ответ 3
Загружается script из внешнего источника. Поэтому вам нужно подождать, пока он загрузится. Вы можете вызвать свою функцию после завершения идентификатора.
var headID = document.getElementsByTagName("head")[0];
var script = document.createElement('script'); script.type='text/javascript';
script.onload=scriptLoaded;
script.src="js/ordini/ImmOrd.js"; script.setAttribute("onload", "crtGridRicProd();");
headID.appendChild(script);
function scriptLoaded(){
// do your work here
}
Ответ 4
Когда я крашу свой код, я понял, что вы пытаетесь добавить событие onload в тег script.
<html>
<head>
<script type="text/javascript" onLoad="crtGridRicPrdo()">
...
</script>
</head>
<body>
...
</body>
</html>
Это будет ваш код javascript. Почему бы вам не добавить его в тег тела?
Это классический способ и будет defnatly работать под IE тоже. Это также уменьшит ваш код:
var bodyID = document.getElementsByTagName("body")[0];
bodyID.setAttribute("onload", "crtGridRicProd();");
Ответ 5
Для более динамичной загрузки js- script (или css файла) в IE вы должны тщательно проверить путь к загруженному файлу! Путь должен начинаться с "/" или "./".
Помните, что IE иногда теряет ведущую косую черту - например, здесь описывается:
https://olgastattest.blogspot.com/2017/08/javascript-ie.html