Javascript 异步加载谷歌地图API

我希望使用jQuery异步加载一个外部JavaScript文件，然后能够调用从外部JavaScript加载的函数。我将JS文件放在html的底部，就在

之前。jQuery代码就在我的代码之前

我正在尝试这个：

(function(){

    $(document).ready(function() {
        obj.init();
    });

    var obj = {

        init:function(){

            $.ajax({
                url: 'http://domain.com/script.js',
                dataType: 'script',
                success: function() {
                    obj.dostuff();
                }
            });

        },
        dostuff:function() {
            // ...do stuff
        }

    }
    window.obj = obj;

})();

Chrome JavaScript控制台正在报告以下情况：

未能对“文档”执行“写入”：除非显式打开异步加载的外部脚本，否则无法从该脚本写入文档。

我试图将我的所有JS保存在一个文件中，所有对象（类和函数样式），然后从

$（document.ready（）中调用每个类（一个
init（）
函数）

我在这里做错了什么？
您可以使用以下命令加载脚本

var scriptElement = document.createElement('script');
scriptElement.src = "http://code.jquery.com/jquery-latest.min.js";
document.getElementsByTagName('head')[0].appendChild(scriptElement);

然后，您可以开始使用jQuery或任何已加载的库

或者类似的东西

function loadMyScript() {
  var script = document.createElement('script');
  script.type = "text/javascript";
  script.src = "http://code.jquery.com/jquery-latest.min.js";
  document.body.appendChild(script);
}

window.onload = loadMyScript;

更新：

(function(app, $, undefined) {

  //public
  app.init = function() {

    var url = "//code.jquery.com/color/jquery.color.js";
    $.getScript(url, function() {
      doStuff();
    });
  };

  //private
  var doStuff = function() {

    $(".block")
      .animate({
        backgroundColor: "rgb(255, 180, 180)"
      }, 1000)
      .delay(500)
      .animate({
        backgroundColor: "olive"
      }, 1000)
      .delay(500)
      .animate({
        backgroundColor: "#00f"
      }, 1000);
  };

}(window.app = window.app || {}, jQuery));
window.onload = app.init;

以下是JsBin：

谷歌地图更新

您只需在链接中说“callback=app.loadMap”

您的回调是什么

(function(app) {

      app.loadMap = function() {
        var mapOptions = {
          zoom: 8,
          center: new google.maps.LatLng(-34.397, 150.644)
        };

        var map = new google.maps.Map(document.getElementById('map-canvas'),
          mapOptions);
      };

      app.loadGoogleMapsScript = function () {
        var script = document.createElement('script');
        script.type = 'text/javascript';
        script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp&' +
          'callback=app.loadMap';
        document.body.appendChild(script);
      };

    }(window.app = window.app || {}));

    window.onload = app.loadGoogleMapsScript;

---

JsBin:

你可以检查这个：这个：谢谢@lolka_bolka，我当然可以，而且已经

$.getScript（）

只是我的

$.ajax（）

调用的简写（因此用

$.getScript（）

替换

$.ajax（）

并不能使我的代码示例工作），其他堆栈问题也不涉及jQuery。我的问题与代码显示的异步JavaScript有关。您知道如何获得

$.ajax（）

以使用jQuery DOM插入而不是

文档。编写
。。？正如我所说，我想使用jQuery以代码显示的方式包含外部异步JavaScript。谢谢@Matija Grcic，但是我如何使用jQuery以代码显示的方式异步包含外部JavaScript呢。。？我不想在我的对象/类/函数系统之外包含JavaScript。再次感谢！在看了您的示例之后，我可以看出问题在于包含的外部JS，而不是我的代码。您包括了一个jQuery颜色扩展，但实际上我正在尝试使用Google地图API:
Maps.googleapis.com/Maps/API/js？key=xxxx
。这显然包括一个
文档。在颜色扩展没有的地方编写
——我的原始代码工作得很好（并且在包含颜色扩展时不会显示控制台错误）……所以这不是我，也不是使用
文档的jQuery。编写
，这是谷歌的API。该死。@CrusaderLtd.你应该说是谷歌地图看到了更新。你说得对，我应该这么说。我已把你的回答标为已接受。我试图使我的示例代码不依赖于任何第三方代码，因此我可以再次使用它来包含其他外部JS，因为我认为问题在于我的代码。