动态加载jQuery的两种方法实例分析
编程学习 2021-07-04 21:48www.dzhlxh.cn编程入门
这篇文章主要介绍了动态加载jQuery的两种方法,实例分析了jquery动态加载的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下
本文实例讲述了动态加载jQuery的两种方法。分享给大家供大家参考。具体如下：
第一种方法参考本站之前有人发的代码，增加了加载检测；
第二种方法来自去年的12306刷票脚本。
第一种方法：
function withjQuery(callback) {
if(!(window.jQuery)) {
var js = document.createElement('script');
js.setAttribute('src', 'https://dynamic.12306.cn/otsweb/js/common/jquery-1.4.2.min.js?version=5.47');
js.setAttribute('type', 'text/javascript');
js.onload = js.onreadystatechange = function() {
if (!this.readyState || this.readyState === 'loaded' || this.readyState === 'complete') {
if(callback && typeof callback === "function") {
callback();
}
js.onload = js.onreadystatechange = null;
}
};
document.getElementsByTagName('head')[0].appendChild(js);
}
}
withjQuery(
function() {
$(function(){ alert("jQuery loaded"); })();
}
);
第二种方法：
// ==UserScript==
// @name 12306 Booking Assistant
// @version 1.4.0
// @author zzdhidden@gmail.com
// @namespace https://github.com/zzdhidden
// @description 12306 订票助手之(自动登录，自动查票，自动订单)
// @include *://dynamic.12306.cn/otsweb/*
// @require https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js
// ==/UserScript==
function withjQuery(callback, safe){
if(typeof(jQuery) == "undefined") {
var script = document.createElement("script");
script.type = "text/javascript";
script.src = "https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js";
if(safe) {
var cb = document.createElement("script");
cb.type = "text/javascript";
cb.textContent = "jQuery.noConflict();(" + callback.toString() + ")(jQuery, window);";
script.addEventListener('load', function() {
document.head.appendChild(cb);
});
}
else {
var dollar = undefined;
if(typeof($) != "undefined") dollar = $;
script.addEventListener('load', function() {
jQuery.noConflict();
$ = dollar;
callback(jQuery, window);
});
}
document.head.appendChild(script);
} else {
setTimeout(function() {
//Firefox supports
callback(jQuery, typeof unsafeWindow === "undefined" ? window : unsafeWindow);
}, 30);
}
}
withjQuery(function($, window){
$(function() { alert("jQuery loaded"); })();
}, true);
希望本文所述对大家的jquery程序设计有所帮助。