Home/ Questions/Q 7950181
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-04T02:11:28+00:00

If you would like to get to the point, here is my question: Is

  • 0

If you would like to get to the point, here is my question:
Is there any way to call a specific script to load first in javascript?

For more detail, please read below:

I have a javascript file that is loading from the bottom of my HTML <body>. Unfortunately, there is no JQuery in the head, so I have to add it through this javascript file.

What I need to do is add a JQuery lightbox plugin.

My problem is that when I load the page, sometimes JQuery isn’t the first thing loaded. So I receive the error “jQuery is not defined”. Which will then raise more errors for undefined methods from the plugin.

This doesn’t happen all the time, only sometimes. Which makes me think it’s a loading/order of operations issue.

Is there any way I can guarantee that my JQuery script is the first thing loaded?

Here is some of my javascript file.

//Get head element
var head = document.getElementsByTagName("head")[0];

//Create and insert JQuery
var jquery = document.createElement('script');
jquery.type = 'text/javascript';
jquery.src = 'http://image.iloqal.com/lib/fe6b/m/1/jquery.1.7.2.js';

head.insertBefore(jquery,head.childNodes[4]);

function thescripts() { 

    var fancybox = document.createElement('script');
    fancybox.type = 'text/javascript';
    fancybox.src = 'http://image.iloqal.com/ilejquery.fancybox-1.3.4.pack.js';
    head.appendChild(fancybox);

    var thebody = document.getElementsByTagName('body')[0];

    thebody.appendChild(thediv);
    thediv.appendChild(theimg);


    //Run fancybox
    thebody.onload = function() {

    $('#lightbox').ready(function() {
        $("#lightbox").fancybox().trigger('click');
    });
}
};
 if(jquery.attachEvent){
     jquery.attachEvent("onload",thescripts());
} else {
     jquery.onload = thescripts();  
}

Any help is appreciated!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Using $(function() {...do your stuff here...}); is the way to go to be sure jQuery is loaded before the script is executed, but you could probably make it harder for yourself and do:

    thebody.onload = function() {
   RunMyjQuery();
}

function RunMyjQuery() {
    if (typeof $ === 'undefined') {
         setTimeout(RunMyjQuery, 500);
    }else{
        $('#lightbox').ready(function() {
            $("#lightbox").fancybox().trigger('click');
        });
    }
}
    • 0