Как вы динамически загружаете файл js с атрибутами и выполняете обратный вызов при загрузке?

Question

Что я пробовал

jQuery's $.getScript делает две из этих вещей, но я не знаю, как добавить атрибут к тегу, который он добавляет на страницу.

Я также попробовал это (примечание: это в Coffeescript):

$("<script>", {src: alohaScriptUrl, "data-aloha-plugins": alohaPlugins})
  .bind("load ready", onAlohaLoad) // also tried: .load(onAlohaLoad)
  .appendTo("head")

С учетом вышеизложенного, файл загружается и есть соответствующий тег, но onAlohaLoad никогда не вызывается.

Как мне достичь всех трех - динамически загружать файл, иметь атрибуты в теге script и выполнять обратный вызов при загрузке ?

Вот код, который объясняет, что я хотел бы сделать, но он не работает:

$ ->
  onAlohaLoad = ->
    console.log("aloha loaded")

  if localStorage["isAdmin"] == "true"
    alohaScriptUrl = "/plugins/alohaeditor-0.20.0-RC9/lib/aloha.js"
    alohaPlugins = "common/format"
    $("<script>", {src: alohaScriptUrl, "data-aloha-plugins": alohaPlugins})
      .bind("load ready", onAlohaLoad)
      .appendTo("head")

Answer 1

Вы можете получить его через AJAX как текст и вывести его в свойстве innerHTML тега сценария. Затем перед добавлением (или после) вы можете установить свои атрибуты для этого элемента скрипта.

var xhr = new XMLHttpRequest();
xhr.open("GET", "test.js", true);
xhr.send(null);
xhr.onreadystatechange = function() {
    if (xhr.readyState != 4)
        return;

    var script = document.createElement("script");
    script.innerHTML = xhr.responseText;
    script.setAttribute(); //add attributes
    document.body.appendChild(script);

    console.log("callback!");
};