从页脚加载带有Javascript的JQuery

Loading JQuery with Javascript from footer

本文关键字:Javascript JQuery 加载      更新时间:2023-09-26

如果你想进入正题,这是我的问题:有没有办法调用特定的脚本在javascript中首先加载?

有关更多详细信息,请阅读以下内容:

我有一个从我的 HTML <body>底部加载的 javascript 文件。不幸的是,头脑中没有JQuery,所以我必须通过这个javascript文件添加它。

我需要做的是添加一个 JQuery 灯箱插件。

我的问题是,当我加载页面时,有时 JQuery 不是第一个加载的东西。所以我收到错误"jQuery 未定义"。然后,这将为插件中未定义的方法引发更多错误。

这不会一直发生,只是偶尔发生。这让我认为这是一个加载/操作顺序问题。

有什么方法可以保证我的 JQuery 脚本是第一个加载的东西吗?

这是我的一些javascript文件。

//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();  
}

任何帮助不胜感激!

试试这个。将这段代码添加到从页脚调用的 javascript 文件中。

<script type="text/javascript">
if(typeof jQuery == 'undefined'){
        document.write('<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.1.min.js"></'+'script>');
  }
</script>

这将包括 jquery,如果它没有加载。我认为这将解决您的问题。

使用 $(function() {...do your stuff here...}); 是确保在执行脚本之前加载 jQuery 的方法,但您可能会让自己更难,并且这样做:

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

你会立即打电话给thescripts,尽管你尽量不这样做。使用这个:

jquery.onload = thescripts; // notice no parentheses

此外,您的thebody.onload策略将不起作用。请改用$(document).ready

$(document).ready(function{
    $('#lightbox').ready(function() {
        $("#lightbox").fancybox().trigger('click');
    });
});