通过嵌入客户端网站的Javascript显示JQuery和Fancybox的弹出窗口

我正在做一个web应用程序，计划允许客户端网站以以下方式在其页面上嵌入来自我的web应用程序的javascript：

<script src="http://example.org/showPopup.js"></script>

假设我的web应用程序位于http://example.org.

我不能假设客户端网站上的页面有JQuery和Fancybox。所以我需要在showPopup.js中加载JQuery和Fancybox

var serverName="localhost";
(function() {
    var myScript = document.createElement('script'); 
    myScript.type = 'text/javascript'; 
    myScript.async = false;
    myScript.src = 'http://' + serverName + '/lib/jquery/jquery-1.11.1.min.js';
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body'[0])).appendChild(myScript);
    myScript = document.createElement('script'); 
    myScript.type = 'text/javascript'; 
    myScript.async = false;
    myScript.src = 'http://' + serverName + '/lib/jquery.fancybox/source/jquery.fancybox.pack.js';
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body'[0])).appendChild(myScript);
    var link = $('<a>');
    link.css('display', 'none');
    link.attr('href', 'http://example.org/mypage.html'); 
    link.addClass('fancybox fancybox.iframe');
    link.fancybox();
    link.trigger('click');
})();

请注意，如果我在自己的应用程序页面上使用上面的代码，那么它是有效的。然而，我在一个客户端网站的页面上测试上述代码时遇到了这个错误。

var link = $('<a>');
ReferenceError: $ is not defined

我该怎么修？做这件事的正确方法是什么？

谢谢和问候。

---------------更新---------------

Qunice提供了工作代码。要使代码完全工作，必须加载fancybox-css。基于Quince的代码，我添加了CSS部分。它似乎在工作。如果有什么问题，请告诉我。

(function () {
    var requestedJQuery = false;
    var requestedFancyBoxJs = false;
    var requestedFancyBoxCss = false;
    function requestJQuery() {
        var myScript = document.createElement('script');
        myScript.type = 'text/javascript';
        myScript.async = false;
        myScript.src = 'http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js';
        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body' [0])).appendChild(myScript);
        requestedJQuery = true;
    }
    function requestFancyboxJs() {
        var myScript = document.createElement('script');
        myScript.type = 'text/javascript';
        myScript.async = false;
        myScript.src = 'http://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.pack.js';
        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body' [0])).appendChild(myScript);
        requestedFancyBoxJs = true;
    }
    function requestFancyboxCss() {
        link = document.createElement( 'link' ); 
        link.setAttribute( 'href', '//cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.css' );
        link.setAttribute( 'rel', 'stylesheet' );
        link.setAttribute( 'type', 'text/css' );
        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body' [0])).appendChild(link);
        requestedFancyBoxCss = true;
    } 
    function checkDependancies() {
        if (typeof $ === 'undefined' || typeof $.fancybox === 'undefined' || !requestedFancyBoxCss) {
            if(!requestedJQuery && typeof $ === 'undefined') {
                requestJQuery();
            }
            if(!requestedFancyBoxJs && (typeof $ === 'undefined' || typeof $.fancybox === 'undefined')) {
                requestFancyboxJs();
            }
            if(!requestedFancyBoxCss) {
                requestFancyboxCss();
            }           
            setTimeout(function () {
                checkDependancies();
            }, 1);
        } else {
            displayFancyBox();
        }
    }

    function displayFancyBox() {
        var link = $('<a>');
        link.css('display', 'none');
        link.attr('href', 'http://jsfiddle.net/');
        link.addClass('fancybox fancybox.iframe');
        link.fancybox();
        link.trigger('click');
    }
    checkDependancies();
})()

希望这能帮助其他人。