Javascript: Loading javascript dependencies inside JS file

Question

i'm trying to load Javascript files that a local js file dependent on them .. the files are external on a website is there a way to load all dependencies at once

Answer 1

You can do it with jQuery

$.getScript("my_lovely_script.js", function(){
  alert("Script loaded and executed.");
  // here you can use anything you defined in the loaded script
});

Hope this helps

Answer 2

I usually load jquery in the head section, then I load the remaining scripts with dependencies inside $(document).ready(). This script ensures to load every js one by one in a synchronous way to avoid conflicts.

          var $apis =[                      
                        "/assets/js/script1.js",                    
                        "/assets/js/script2.js"
                    ];

        var deferred = new $.Deferred(), step = deferred;
        $.each($apis, function(i, val) {
            step = step.then(function() {
                return $.getScript(val, function() {
                    if(i==$apis.length-1) {   
                        // initialize here after all scripts are loaded
                    }
                });                     
            });        
        });    
        deferred.resolve();