Загрузить переменные в асинхронный JS?

Question

Я пытаюсь вставить некоторые переменные в загружаемый скрипт. В настоящее время у меня есть

window.myApp = {
    id: ''
};

И я загружаю JavaScript как

(function() {
    var s = document.createElement('script');
    s.type = 'text/javascript';
    s.async = true;
    s.src = 'http://blah.com/widget.js';
    var x = document.getElementsByTagName('script')[0];
    x.parentNode.insertBefore(s, x);
  })();

widget.js имеет пространство имен window.myApp, и я пытаюсь вставить в него .id? Как я могу это сделать?

Answer 1

Внутри widget.js вы можете сделать это:

var alreadyDefinedProps = window.myApp;

window.myApp = {
   // whatever properties widget.js has currently
}

if (alreadyDefinedProps) {
   for (var prop in alreadyDefinedProps)
       window.myApp[prop] = alreadyDefinedProps[prop];
}

То есть сохранить ссылку на существующий объект window.myApp, затем установить window.myApp для другого объекта, а затем скопировать свойства.Вы можете добавить тест if для обработки случая, когда одно и то же свойство определено в обоих файлах JS.

Answer 2

После загрузки скрипта вы можете читать или записывать свойства из объекта myApp.Чтобы определить, когда асинхронный скрипт загружен, вы можете захватить событие при его загрузке.См. эту ссылку для получения подробной информации о том, как это сделать.

Answer 3

Вам нужен обработчик события для load события тега скрипта, который вы вставляете, например:

if (s.attachEvent) {
    s.attachEvent("onload", function () {
        window.myApp.id = '';
    });
} else {
    s.addEventListener("load", function () {
        window.myApp.id = '';
    });
}

Это добавляет обратный вызов, даже для IE, для скрипта loadсобытие.Вставьте этот код после строки, которая гласит s.async = true;