0

I am working on JavaScript widgets. Below is my code calling widgets html page.

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
  <script src="http://localhost/widget1/widget1.js" type="text/javascript"></script>
  <script src="http://localhost/widget1/widget2.js" type="text/javascript"></script>
</head>

<body>
  <div style="width: 100%; height: 100%;display: inline-block;background-color:#eee">
    <h1 align="center"><a href="#">Demo test</a></h1>
    <div id="container1" style="width: 45%; height: 300px;display: inline-block;margin:30px"></div>
    <div id="container2" style="width: 45%; height: 300px;display: inline-block;margin:30px"></div>
    <br>
  </div>
</body>

</html>

and below is my widgets1.js and widgets2.js files: 

(function() {
  // Localize jQuery variable
  var jQuery;

  /******** Load jQuery if not present *********/

  if (typeof jQuery == undefined || typeof jQuery != '1.9.1') {
    var script_tag = document.createElement('script');
    script_tag.setAttribute("type", "text/javascript");
    script_tag.setAttribute("id", "jqueryLib");
    script_tag.setAttribute("src", "http://code.jquery.com/jquery-1.9.1.js");
    if (script_tag.readyState) {
      script_tag.onreadystatechange = function() { // For old versions of IE
        if (this.readyState == 'complete' || this.readyState == 'loaded') {
          scriptLoadHandler();
        }
      };
    } else {
      script_tag.onload = scriptLoadHandler;
    }
    // Try to find the head, otherwise default to the documentElement
    (document.getElementsByTagName("head")[0] || document.documentElement).appendChild(script_tag);
    //}
  } else {
    //The jQuery version on the window is the one we want to use
    jQuery = window.jQuery;
    main();
  }
})();

On html page firstly I am loading widgets1.js file and secondly I am loading widgets2.js file.I am checking http://code.jquery.com/jquery-1.9.1.js file if not define to load.

This file is loaded in widgets1.js file but http://code.jquery.com/jquery-1.9.1.js file get loaded again in widgets2.js file which i don't won't to load again.

I am checking with typeof jQuery == undefined but not validate and file get loaded two times.

Bhuwan
  • 16,525
  • 5
  • 34
  • 57
B Developer2
  • 49
  • 2
  • 9

2 Answers2

0

That's not a great way to check it, but the if-statement wouldn't work. Try if (!window.jQuery), that should work.

Also, this part:

jQuery = window.jQuery;
main();

you might want to take it outside the else-statement, because I assume you always want to execute those two lines.

A few notes:

  1. When checking the typeof something, you should compare it with a string. So typeof jQuery !== 'undefined' (notice the quotes) is the correct check here.
  2. typeof jQuery === '1.9.1' will never be true. The typeof jQuery would be 'function' if it's loaded.
Vergil Penkov
  • 380
  • 2
  • 11
  • `$` could be something else than jQuery – A. Wolff Dec 18 '17 at 12:22
  • Also, none of my business, but why are you assigning `jQuery = window.jQuery;` if you're not using it anywhere in that function after assigning it? – Vergil Penkov Dec 18 '17 at 12:22
  • OP will never know if `$` is used for something else. From what I understand, they're developing a widget, meaning, some JS code injection in an existing page, and they precisely want to know what's already loaded in the host's DOM. – Jeremy Thille Dec 18 '17 at 12:26
  • @JeremyThille might be a widget for his own site. I've removed that part to avoid confusion. Thanks guys. – Vergil Penkov Dec 18 '17 at 12:28
0

Try this,

var s;
if (void 0 === window.jQuery || "1.4.2" !== window.jQuery.fn.jquery) {
var i = document.createElement("script");
i.setAttribute("type", "text/javascript"), i.setAttribute("src", "http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"), i.readyState ? i.onreadystatechange = function() {
    ("complete" == this.readyState || "loaded" == this.readyState) && e()
} : i.onload = e, (document.getElementsByTagName("head")[0] || document.documentElement).appendChild(i)
} else s = window.jQuery, l()
}
Girija
  • 109
  • 2
  • 16