Javascript Check if local Script exists

Question

Supposing I have a script that might not always be present how do I make sure not to call if it doesn't exist?

HTML section

<script src="js/model.js"></script>
<script src="js/view.js"></script>
<script src="js/controller.js"></script>
<script src="js/script.js"></script>

(function(model, view, script){
"use strict";
     document.addEventListener('loadata', function (e) {
         script.loadData(e.detail);
 });

Controller.js section

How do I stop Controller from making use of the script if it doesn't exist?

And how would I remove it from the HTML file?

EDIT: I also make one or 2 calls to functions in script from Controller

To stop using script, one suggestion would be to set a global var in script which then you can search for in controller to be sure script was loaded and executed — Mark E
– Mark E, Commented Jan 29, 2017 at 17:17
So var script = (function(){ "use strict"; var check =true;.... How would I access this in Controller? and wouldnt (function(model, view, script){ be problematic aswell — aa11
– aa11, Commented Jan 29, 2017 at 17:23
To make sure the flag is available everywhere you set it inside script like window.scriptFlag = true then you can check for it anywhere in the code with something like if( typeof window.scriptFlag != "undefined" ) although I'm not sure why would you not be sure it is loaded, that seems to me a bad design logic. And of course it would cause trouble in that code, you would need first to check if script exists and then use it. — Mark E
– Mark E, Commented Jan 29, 2017 at 17:29
Well I only really want to use the script to load data if present. The user might remove it so then I cant make use of script then. Do you see a better way of handling the scenario? — aa11
– aa11, Commented Jan 29, 2017 at 17:32
I don't get what must be present for the script to load, but if this is not a site with ajax-navigation I think you should load all the needed js files, trust that they will be there when needed and just trigger them when user interaction require it. — Mark E
– Mark E, Commented Jan 29, 2017 at 17:39

Vladu Ionut · Accepted Answer · 2017-01-29 17:32:23Z

2

Solution 1

you can add a flag within script.js (in global scope)

var myCustomFlag = true;

and in controller you can check if this has run:

if (window.myCustomFlag == true) {
//stop your controller etc
}

Solution 2

You can check for the existence of the tag using querySelectorAll

in your controller

var scriptIsLoaded = document.querySelectorAll("script[src='js/script.js']").length > 0;
if (scriptIsLoaded ){
 //stop your controller etc
}

answered Jan 29, 2017 at 17:16

Vladu Ionut

8,2231 gold badge23 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Ahh so this would allow me to access the element and modify it if needed. Any ideas for my first question?

what is the first question ?

How do I stop Controller from making use of the script if it doesn't exist?

Thanks, would (function(model, view, script){ cause an error if script is not present?