check whether jquery is already defined or not

Question

Hi i am trying to create a plugin for my client, i will just add the following code in their html.

<html>
<head>
</head>

<body>
    <script type="text/javascript">
    var clientID = "123";

    (function() {
        var test = document.createElement('script'); test.type = 'text/javascript'; test.async = true;
        test.src = 'myjavascript.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(test, s);
    })();
    </script>

    <div id="addimage"></div>
</body>
</html>

And in myjavascript.js file i will call the jquery library.

if (typeof jQuery === "undefined") {
    var script = document.createElement('script');
    script.src = 'http://mysite.com/js/jquery-1.7.1.min.js';
    script.type = 'text/javascript';
    document.getElementsByTagName('head')[0].appendChild(script);
}


if (typeof jQuery === "undefined") {
    var script = document.createElement('script');
    script.src = 'http://mysite.com/js/fancybox.js';
    script.type = 'text/javascript';
    document.getElementsByTagName('head')[0].appendChild(script);
}

// my rest code goes here

So i would like to check whether the client html already has to call for jquery-1.7.1.min.js if not, then only include the 1.7.1.min.js file in myquery.js

How to check whether its already included or not. Please help!

possible duplicate of [Can a javascript check for jQuery and load it if not already present?](http://stackoverflow.com/questions/6708716/can-a-javascript-check-for-jquery-and-load-it-if-not-already-present) — Alastair Pitts, Jul 19 '12 at 07:33
possible duplicate of [check if jquery has been loaded, then load it if false](http://stackoverflow.com/questions/1828237/check-if-jquery-has-been-loaded-then-load-it-if-false) — outis, Jul 20 '12 at 10:25
Possible duplicate of [check if jquery has been loaded, then load it if false](https://stackoverflow.com/questions/1828237/check-if-jquery-has-been-loaded-then-load-it-if-false) — Govind Samrow, Sep 06 '17 at 04:12

Tim S. · Answer 1 · 2012-07-19T07:59:25.960

10

Usually you use !!variable to see if a variable is set or not. This way is used in many, many famous frameworks so I tend to use it as well.

if(!!window.jQuery) {
    // jQuery is loaded
} else {
    // load jQuery first
}

Looking at your question though, your method should work too! Using typeof variable === 'undefined' is a very valid approach as well.

Edit: Apparently this isn't enough information so I'll just rewrite your code

if(!window.jQuery) {
    var script = document.createElement('script');
    script.src = 'http://mysite.com/js/jquery-1.7.1.min.js';
    script.type = 'text/javascript';
    document.getElementsByTagName('body')[0].appendChild(script);
}

edited Jul 19 '12 at 07:59

answered Jul 19 '12 at 07:27

Tim S.

13,597
7
46
72

@user100311 I have changed my code a little bit. If jQuery is **not** defined you want to define it. That means you have to put the code you use to load jQuery in the `else` block. Also, you can remove the if-statement you currently use to check if jQuery is defined or not. – Tim S. Jul 19 '12 at 07:55
1

@user100311 I have edited the code, you should be able to copy-paste the code now... – Tim S. Jul 19 '12 at 07:59

amd · Answer 2 · 2012-07-19T08:08:50.907

2

in Addition to Tim S. answer you can use $.jquery to get the version

var head = document.getElementsByTagName('head')[0];
if(!! jQuery && jQuery('body').jquery == '1.7.1'){

    // jquery 1.7.1 included so only put your script
    var script = document.createElement('script');
    script.src = 'http://mysite.com/js/myotherscripts';
    script.type = 'text/javascript';
    head.appendChild(script);


} else {

    // Include jquery first 
    var script = document.createElement('script');
    script.src = 'http://mysite.com/js/jquery-1.7.1.min.js';
    script.type = 'text/javascript';
    head.appendChild(script);

    // Then include your scripts
    var script = document.createElement('script');
    script.src = 'http://mysite.com/js/myotherscripts';
    script.type = 'text/javascript';
    head.appendChild(script);

}

edited Jul 19 '12 at 08:08

answered Jul 19 '12 at 07:39

amd

20,637
6
49
67

@tim i added like this if(!! jQuery && jQuery('body').jquery == '1.7.1'){ if (typeof jQuery === "undefined") { var script = document.createElement('script'); script.src = 'http://..../js/jquery-1.7.1.min.js'; script.type = 'text/javascript'; document.getElementsByTagName('head')[0].appendChild(script); } } and it dosnt work. – Christina Jul 19 '12 at 07:46
@user100311 Look at the comments and my edit at my answer... You can't expect everyone to start discussing in the comments section at a single answer - you have to look around. You can also look at your profile (there's a link in the top bar) where you can easily see new responses marked in blue. – Tim S. Jul 19 '12 at 08:05

score 1 · Answer 3 · answered Sep 05 '17 at 23:53

1

if(typeof jQuery != "undefined") {
   $('.input-number').inputmask('+7 (999) 999-9999');
}

answered Sep 05 '17 at 23:53

Web Expert

11
1

1

While this code may answer the question, providing additional context regarding how and/or why it solves the problem would improve the answer's long-term value. – Aydin4ik Sep 06 '17 at 00:03

check whether jquery is already defined or not

3 Answers3