Board logo

標題: jQuery anywhere, YUI anywhere (bookmarklets) [打印本頁]
作者: wmh    時間: 2010-4-27 00:02     標題: jQuery anywhere, YUI anywhere (bookmarklets)

以下是兩個 bookmarklets，你可以點擊一下執行，立即給你 ＄＄，不是給你錢啦，是給你 jQuery 的 $ 和 YUI 3 的 Y

[jsg.example]
<a href='javascriptfunction(){if(typeof window.$!=="undefined"){$.fn&&$.fn.jquery?alert("jQuery "+$.fn.jquery+" is already loaded!"):alert("$ is already defined!");return false}var b,a=document.createElement("script");b=function(){alert("jquery "+$.fn.jquery+" is ready for you.")};a.setAttribute("type","text/javascript");a.setAttribute("src","http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js");document.getElementsByTagName("head")[0].appendChild(a);a.onreadystatechange=function(){a.readyState==="complete"&& b()};a.onload=function(){b()}})();'>giveMe$</a> (jQuery)
&nbsp; &nbsp;
<a href='javascriptfunction(){if(typeof window.Y!=="undefined"){alert("Y is already defined!");return false}if(typeof YUI==="function"&&typeof YUI().version==="string"){YUI().use("node",function(b){window.Y=b;alert("YUI "+YUI().version+" is ready for you!")});return false}var c,a=document.createElement("script");c=function(){YUI().use("node",function(b){window.Y=b;alert("YUI "+YUI().version+" is ready for you!")})};a.setAttribute("type","text/javascript");a.setAttribute("src","http://yui.yahooapis.com/3.1.0/build/yui/yui-min.js"); document.getElementsByTagName("head")[0].appendChild(a);a.onreadystatechange=function(){a.readyState==="complete"&&c()};a.onload=function(){c()}})();'>giveMeY</a> (YUI)
[/jsg.example]

如果你會需要在別人的網頁動態載入 jQuery 或 YUI (做測試或做壞事?!)，也可以把這兩個連結拖曳到書籤列上，之後隨時可以在任何網頁做動態載入 jQuery 或 YUI3。

giveMe$ 是透過 Google 所提供的 AJAX Libaray 載入的，會載入 1.x 最新版，source code 如下:
(function () {
    if (typeof window.$ !== 'undefined') {
        if ($.fn && $.fn.jquery) {
            alert('jQuery ' + $.fn.jquery + ' is already loaded!');
        } else {
            alert('$ is already defined!');
        }
        return false;
    }
    var giveMe$, js = document.createElement('script');
    giveMe$ = function () {
        alert("jquery " + $.fn.jquery + " is ready for you.");
    };
    js.setAttribute('type', 'text/javascript');
    js.setAttribute('src', 'http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js');
    document.getElementsByTagName('head')[0].appendChild(js);
    js.onreadystatechange = function () {
        if (js.readyState === 'complete') {
            giveMe$();
        }
    };
    js.onload = function () {
        giveMe$();
    };
}());
YUI3 則是透過 Yahoo! 提供的 js，拉目前最新版 3.1.0 並載入 node，再把 Y 設成 global：
(function () {
    if (typeof window.Y !== 'undefined') {
        alert('Y is already defined!');
        return false;
    }
    if (typeof YUI === 'function' && typeof YUI().version === 'string') {
        YUI().use('node', function (Y) {
            window.Y = Y;
            alert('YUI ' + YUI().version + ' is ready for you!');
        });
        return false;
    }
    var giveMeY, js = document.createElement('script');
    giveMeY = function () {
        YUI().use('node', function (Y) {
            window.Y = Y;
            alert('YUI ' + YUI().version + ' is ready for you!');
        });
    };
    js.setAttribute('type', 'text/javascript');
    js.setAttribute('src', 'http://yui.yahooapis.com/3.1.0/build/yui/yui-min.js');
    document.getElementsByTagName('head')[0].appendChild(js);
    js.onreadystatechange = function () {
        if (js.readyState === 'complete') {
            giveMeY();
        }
    };
    js.onload = function () {
        giveMeY();
    };
}());




歡迎光臨 jsGears.com 技術論壇 - AJAX, JavaScript, jQuery, 網站開發, 前端效能優化 (http://jsgears.com/)