Подтвердить что ты не робот

Загрузка Javascript Динамически и как проверить, существует ли script

Я использую следующий метод для динамического загрузки Javascript:

var script = document.createElement("script");
script.type = "text/javascript";
script.src = "file.js";
document.body.appendChild(script);

Это довольно общий подход. Он также обсуждался здесь: http://www.nczonline.net/blog/2009/06/23/loading-javascript-without-blocking/

Я знаю, как получать уведомления после того, как файл был загружен и выполнен

То, что я не знаю, это то, что если ссылка на исходный файл Javascript сломана, как я могу получить уведомление.

Спасибо

4b9b3361

Ответ 1

Прослушивание событий на элементах script не считается надежным (Источник). Один из вариантов, который приходит на ум, - использовать setTimeout() для опроса для переменной, которую вы ожидаете определить в своем внешнем script. После x секунд вы можете пропустить свой опрос и считать script сломанным.

Внешний Script: file.js:

var MyLibrary = { };

Основной документ:

var poll;
var timeout = 100; // 10 seconds timeout
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'file.js';
document.body.appendChild(script);

poll = function () {
  setTimeout(function () {
    timeout--;
    if (typeof MyLibrary !== 'undefined') {
      // External file loaded
    }
    else if (timeout > 0) {
      poll();
    }
    else {
      // External library failed to load
    }
  }, 100);
};

poll();

Ответ 2

Это довольно просто, Internet Explorer вызовет событие onreadystatechange, в то время как другие вызовут событие onload для объекта script.

var newScript;
var loadFunc = function ()
{
    alert("External Javascript File has been loaded");
};
newScript = document.createElement('script');
newScript.setAttribute('type','text/javascript');
newScript.setAttribute('src','file.js');

//IE triggers this event when the file is loaded
if (elm.attachEvent)
{
    newScript.attachEvent('onreadystatechange',function() 
    {
        if (newScript.readyState == 'complete' || newScript.readyState == 'loaded')
            loadFunc();
    });
}

//Other browsers trigger this one
if (newScript.addEventListener)
    newScript.addEventListener('load', loadFunc, false);

document.getElementsByTagName('head')[0].appendChild(newScript);

Ответ 3

var script = document.createElement("script");
script.type = "text/javascript";
script.src = "file.js";

Вам нужно добавить обратный вызов для этого script.

1st: Создайте обратный вызов:

function callbackFn(callbackArgs) = {
       console.log("script is loaded with the arguments below");
       console.log(callbackArgs);
    }

2nd: Добавьте прослушиватель событий в script. Как Firefox, так и Chrome поддерживают событие onload, поэтому вы можете использовать его следующим образом:

script.onload = callbackFn();

Для IE... Вы можете добавить прослушиватель событий для изменения состояния следующим образом:

script.onreadystatechange = function() {
    if ( this.readyState != "loaded" ) return;
    callbackFn();
    }

Last: Добавить script в тело, как вы это делали.

document.body.appendChild(script);

Для получения дополнительной информации, пожалуйста, обратитесь к этой статье.

Ответ 4

Одним из способов было бы определить переменную в script, которую вы включили, а затем проверить, определена ли эта переменная или нет.

Ответ 5

В событии onload есть коды состояния. 200 - это хорошо, 404, как вы помните, означает, что файл не найден. Полезно?

Ответ 6

Загрузка динамического script намного проще:

var script = document.createElement('script');
script.onload = function () {
  main_function();  // Main function to call or anything else or nothing  
};
script.src = "yourscript.js";
document.head.appendChild(script);    

Ответ 7

Вы можете добавить атрибут onload и в этот атрибут, вы можете вызвать функцию, которая будет запущена после загрузки файла JS.

Проверьте код:

var jsElement = document.createElement("script");
jsElement.type = "application/javascript";
jsElement.src = "http://code.jquery.com/jquery-latest.min.js";
jsElement.setAttribute("onload","getMeAll()");
document.body.appendChild(jsElement);
function getMeAll(){
    //your code goes here
}

Надеюсь, что это поможет.

Ответ 8

Какую библиотеку JavaScript вы используете?

В jQuery, если вы загружаете script через Ajax, у вас есть возможность запустить функцию обратного вызова успеха (и другие типы обратных вызовов)...

Существует также специальная функция для загрузки скриптов: $.getScript()