Jaime Dolor jr.
Jaime Dolor jr.

Reputation: 919

How do I load the functions of a JavaScript File called through a JavaScript Object

I have a local JS file that needs to be called using a script object. However, I am not able to get the functions to run. Here's the code snippet.

<script type="text/javascript">
 var x = document.createElement("SCRIPT");
 x.type = "text/javascript";
 x.src = "file:///C:/scripts/localscript.js";
 //one of the functions is loadData();
 loadData(); //I'm getting reference error, loadData is not defined.
</script>

Thank you,

Upvotes: 0

Views: 56

Answers (2)

Ravi Tiwari
Ravi Tiwari

Reputation: 962

You need to create a script element and insert it in DOM (mostly under head) to load the script. When that script is loaded by the browser, whatever you return from that script will be available.

Consider sampleScript.js with below code

(function(window){
  'use strict';

  window.app = {
    sayHi: function() {
      console.log('Hey there !');
    }

  };

})(this);

To load this script, I do

<script>
   var node = document.createElement('script');
   node.src = 'sampleScript.js';
   node.addEventListener('load', onScriptLoad, false);
   node.async = true;
   document.head.appendChild(node);

   function onScriptLoad(evt) {
     console.log('Script loaded.');
     console.log('app.sayHi ---> ');
     app && app.sayHi();
   }
</script>

Taking cues, you can fit to your need. Hope this helps.

Upvotes: 1

David Hellsing
David Hellsing

Reputation: 108500

Use the onload event:

x.onload = function() { window.loadData(); }

Upvotes: 0

Related Questions