CSS、JS动态加载,加强版

var dcLoader = {
    load: function(option,callback){
        var _type = "",_url = "";
        var _callback = callback
        option.type? _type = option.type:"";
        option.url? _url = option.url:"";
        typeof option.filtration === "boolean"? filtration = option.filtration:"";
        switch(_type){
            case "js":
            case "javascript": this.js(_url,_callback); break;
            case "css": this.link(_url,_callback); break;
        }
        return this;
    },
    js: function(url,callback){
        var urls = url.replace(/[,]\s*$/ig,"").split(",");
        var scripts = [];
        var completeNum = 0;
        for( var i = 0; i < urls.length; i++ ){
            scripts[i] = document.createElement("script");
            scripts[i].type = "text/javascript";
            scripts[i].src = urls[i];
            document.getElementsByTagName("head")[0].appendChild(scripts[i]);
            if(!this.func(callback)){return this;}
            if(scripts[i].readyState){
                scripts[i].onreadystatechange = function(){
                    if( this.readyState === "loaded" || this.readyState === "complete" ){
                        this.onreadystatechange = null;
                        completeNum++;
                        completeNum >= urls.length ? callback () : '';
                    }
                }
            }else{
                scripts[i].onload = function(){
                    completeNum ++;
                    completeNum >= urls.length ? callback () : '';
                }
            }

        }
        return this;
    },
    link : function(url,callback){
        var urls = url.replace(/[,]\s*$/ig,"").split(",");
        var links = [];
        for( var i = 0; i < urls.length; i++ ){
            links[i] = document.createElement("link");
            links[i].rel = "stylesheet";
            links[i].href = urls[i];
            document.getElementsByTagName("head")[0].appendChild(links[i]);
        }
        this.func(callback) ? callback() : '';
        return this;
    },
    func : function isFunction(fn) {
        return Object.prototype.toString.call(fn)=== '[object Function]';
    }
};

Continue reading...

香港地名js二级联动菜单

Javascript部份,

  1. <script type="text/javascript">  
  2. function hongkong(hk){  
  3. var area = document.getElementById("area");  
  4. var hongkong = {  
  5.   '香港':['堅尼地城','西營盤','中上環','西半山','中半山','灣仔','銅鑼灣','東半山','跑馬地','大坑','渣甸山','天后','炮台山','北角','北角半山/寶馬山','鰂魚涌','太古城/康怡','西灣河','筲箕灣','杏花邨','柴灣','小西灣','薄扶林','香港仔','鴨脷洲','壽臣山','淺水灣','舂磡角','赤柱','大潭','紅山半島','石澳','山頂'],  
  6.   '九龍':['荔枝角','美孚','長沙灣','深水埗','大角咀','奧運站','九龍站','石硤尾','又一村','畢架山','九龍塘','何文田','太子','旺角','佐敦','油麻地','尖沙咀','紅磡','黃埔','土瓜灣','九龍城','黃大仙','橫頭磡','樂富','新蒲崗','鑽石山','慈雲山','牛池灣','九龍灣','牛頭角','觀塘','藍田','油塘'],  
  7.   '新界':['葵涌','大窩口','荃灣','深井','青衣','黃金海岸','屯門','元朗','天水圍','錦繡/加州','上水','沙頭角','粉嶺','大埔','火炭','沙田','大圍','馬鞍山','西貢','清水灣','將軍澳'],  
  8.   '離島':['東涌','愉景灣','大澳','南大嶼山','馬灣','長洲','南丫島','坪洲']  
  9.   };  
  10.   area.innerHTML = null;  
  11.   area.add(new Option('任何',''));  
  12.   for(var i in hongkong[hk]){  
  13.     area.add(new Option(hongkong[hk][i],hongkong[hk][i]));  
  14.   }  
  15. }  
  16. </script>  

HTML部份

  1. <select name="region" class="select" onChange="hongkong(this.value)"/>  
  2.     <option value="">任何</option>  
  3.     <option value="香港">香港</option>  
  4.     <option value="九龍">九龍</option>  
  5.     <option value="新界">新界</option>  
  6.     <option value="離島">離島</option>  
  7. </select>  
  8. <select id="area" name="area" class="select">  
  9.     <option value="0">任何</option>  
  10. </select>  

Continue reading...

判断手机浏览器js自动跳转

  1. <script type="text/javascript">   
  2.         (function(W){   
  3.             if(/iphone|nokia|sony|ericsson|mot|samsung|sgh|lg|philips|   
  4. panasonic|alcatel|lenovo|cldc|midp|wap|   
  5. mobile/i.test(navigator.userAgent.toLowerCase())){   
  6.                 W.location.href = '跳转地址';   
  7.             }   
  8.                
  9.         })(window)   
  10. </script>  

Continue reading...

Javascript 简写绝句

1. 取整同时转成数值型:

  1. '10.567890'|0   
  2. //结果: 10   
  3. '10.567890'^0   
  4. //结果: 10   
  5. -2.23456789|0   
  6. //结果: -2   
  7. ~~-2.23456789   
  8. //结果: -2  

2. 日期转数值:

  1. var d = +new Date(); //1295698416792  

3. 类数组对象转数组:

  1. var arr = [].slice.call(arguments)  

4. 漂亮的随机码:

  1. Math.random().toString(16).substring(2); //14位   
  2. Math.random().toString(36).substring(2); //11位  

5. 合并数组:

  1. var a = [1,2,3];   
  2. var b = [4,5,6];   
  3. Array.prototype.push.apply(a, b);   
  4. uneval(a); //[1,2,3,4,5,6]  

6. 用0补全位数:

  1. function prefixInteger(num, length) {   
  2.     return (num / Math.pow(10, length)).toFixed(length).substr(2);   
  3. }  

7. 交换值:

  1. a= [b, b=a][0];  

8. 将一个数组插入另一个数组的指定位置:

  1. var a = [1,2,3,7,8,9];   
  2. var b = [4,5,6];   
  3. var insertIndex = 3;   
  4. a.splice.apply(a, Array.concat(insertIndex, 0, b));   
  5. // a: 1,2,3,4,5,6,7,8,9  

9. 删除数组元素:

  1. var a = [1,2,3,4,5];   
  2. a.splice(3,1);  

10. 快速取数组最大和最小值

  1. Math.max.apply(Math, [1,2,3]) //3   
  2. Math.min.apply(Math, [1,2,3]) //1  

11. 条件判断:

  1. var a = b && 1;   
  2. //相当于   
  3. if (b) {   
  4.     a = 1;   
  5. } else {   
  6.     a = b;   
  7. }   
  8.     
  9. var a = b || 1;    
  10. //相当于   
  11. if (b) {   
  12.     a = b;   
  13. } else {   
  14.     a = 1;   
  15. }  

12. 判断IE(两种方法):

  1. var ie = /*@cc_on !@*/false;   
  2. var ie = !-[1,];  

Continue reading...

javascript 动态加载js css 回调

一款实现无阻塞加载javascript的js、css动态加载器(css 是顺带的功能…),作用是给目标js、css通过createElement方式动态append到body中的head里头,并提供加载成功时回调函数的功能。
载自:http://www.jackness.org/?p=716

  1. /*  
  2.  * jcLoader()  一个简单的 js、css动态加载 api  
  3.  * jcLoader().load(url,callback)  加载函数 支持链式操作  
  4.  * -url 需要加载的 js/css 地址,支持同时加载多个 地址之间用 ‘,’隔开  
  5.  * -callback 加载完成 url里面的文件之后触发的事件  
  6.  * ---------------------------------------------------  
  7.  * example:  
  8.  
  9. 完整版:  
  10. jcLoader().load({  
  11.     type:"js",  
  12.     url:"temp/demojs01.js,temp/demojs02.js,temp/demojs03.js,temp/demojs04.js,temp/demojs05.js,"  
  13. },function(){  
  14.     alert("all file loaded");  
  15. }).load({  
  16.     type:"css",  
  17.     url:"temp/democss01.css"  
  18. },function(){  
  19.     alert("all css file loaded");  
  20. })  
  21. 简单版:  
  22. jcLoader().load({type:"js",url:"temp/demojs01.js"},function(){alert("all file loaded")});  
  23. jcLoader().load({type:"css",url:"temp/democss01.css"},function(){alert("all css file loaded")});  
  24.  
  25.  * ---------------------------------------------------  
  26.  * power by jackNEss  
  27.  * date:2011-11-10(光棍节前夕)  
  28.  * ver 1.0  
  29.  */  
  30. var jcLoader = function(){   
  31.   
  32.     var dc = document;   
  33.   
  34.     function createScript(url,callback){   
  35.         var urls = url.replace(/[,]\s*$/ig,"").split(",");   
  36.         var scripts = [];   
  37.         var completeNum = 0;   
  38.         forvar i = 0; i < urls.length; i++ ){   
  39.   
  40.             scripts[i] = dc.createElement("script");   
  41.             scripts[i].type = "text/javascript";   
  42.             scripts[i].src = urls[i];   
  43.             dc.getElementsByTagName("head")[0].appendChild(scripts[i]);   
  44.   
  45.             if(!callback instanceof Function){return;}   
  46.   
  47.             if(scripts[i].readyState){   
  48.                 scripts[i].onreadystatechange = function(){   
  49.   
  50.                     ifthis.readyState == "loaded" || this.readyState == "complete" ){   
  51.                         this.onreadystatechange = null;   
  52.                         completeNum++;   
  53.                         completeNum >= urls.length?callback():"";   
  54.                     }   
  55.                 }   
  56.             }   
  57.             else{   
  58.                 scripts[i].onload = function(){   
  59.                     completeNum++;   
  60.                     completeNum >= urls.length?callback():"";   
  61.                 }   
  62.             }   
  63.   
  64.         }   
  65.   
  66.     }   
  67.   
  68.     function createLink(url,callback){   
  69.         var urls = url.replace(/[,]\s*$/ig,"").split(",");   
  70.         var links = [];   
  71.         forvar i = 0; i < urls.length; i++ ){   
  72.             links[i] = dc.createElement("link");   
  73.             links[i].rel = "stylesheet";   
  74.             links[i].href = urls[i];   
  75.             dc.getElementsByTagName("head")[0].appendChild(links[i]);   
  76.         }   
  77.         callback instanceof Function?callback():"";   
  78.     }   
  79.     return{   
  80.         load:function(option,callback){   
  81.             var _type = "",_url = "";   
  82.             var _callback = callback   
  83.             option.type? _type = option.type:"";   
  84.             option.url? _url = option.url:"";   
  85.             typeof option.filtration == "boolean"? filtration = option.filtration:"";   
  86.   
  87.             switch(_type){   
  88.                 case "js":   
  89.                 case "javascript": createScript(_url,_callback); break;   
  90.                 case "css": createLink(_url,_callback); break;   
  91.             }   
  92.   
  93.             return this;   
  94.         }   
  95.     }   
  96. }  

Continue reading...



about me

  • 陶之11's Blog Name:陶之11 OICQ:14779023 Site:Pao11.com

分类

快捷入口