zoukankan      html  css  js  c++  java
  • jQuery动态加载js脚本文件

    jQuery getScript()方法加载JavaScript

    jQuery.getScript("/path/to/myscript.js", function(data, status, jqxhr) {
     /* 
      做一些加载完成后需要执行的事情
     */ 
    });
    

      

    jQuery.getScript("/path/to/myscript.js")
     .done(function() {
      /* 耶,没有问题,这里可以干点什么 */
     })
     .fail(function() {
      /* 靠,马上执行挽救操作 */
    });
    

      

    jquery getScript动态加载JS方法改进

    <!DOCTYPE html > 
    <html> 
    <head> 
    <meta charset="utf-8"> 
    <title></title> 
    <script src="jquery-1.7.2.min.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
    //定义一个全局script的标记数组,用来标记是否某个script已经下载到本地 
    var scriptsArray = new Array(); 
    $.cachedScript = function (url, options) { 
    //循环script标记数组 
    for (var s in scriptsArray) { 
    //console.log(scriptsArray[s]); 
    //如果某个数组已经下载到了本地 
    if (scriptsArray[s]==url) { 
    return { //则返回一个对象字面量,其中的done之所以叫做done是为了与下面$.ajax中的done相对应 
    done: function (method) { 
    if (typeof method == 'function'){ //如果传入参数为一个方法 
    method(); 
    } 
    } 
    }; 
    } 
    } 
    //这里是jquery官方提供类似getScript实现的方法,也就是说getScript其实也就是对ajax方法的一个拓展 
    options = $.extend(options || {}, { 
    dataType: "script", 
    url: url, 
    cache:true //其实现在这缓存加与不加没多大区别 
    }); 
    scriptsArray.push(url); //将url地址放入script标记数组中 
    return $.ajax(options); 
    }; 
    $(function () { 
    $('#btn').bind('click', function () { 
    $.cachedScript('t1.js').done(function () { 
    alertMe(); 
    }); 
    }); 
    $('#btn2').bind('click', function () { 
    $.getScript('t1.js').done(function () { 
    alertMe(); 
    }); 
    }); 
    }); 
    </script> 
    </head> 
    <body> 
    <button id="btn">自定义的缓存方法</button> 
    <br /> 
    <button id="btn2">getScript</button> 
    </body> 
    </html>
    

      t1.js中代码也就是一个函数 

    function alertMe() { 
    alert('clicked me'); 
    }
    

      

  • 相关阅读:
    让我偷偷的告诉你:运维加薪的杀手锏是啥?
    网站页面优化必然趋势—WebP 图片!
    如何监控 Tomcat?Zabbix 与 Cloud Insight 对比
    网页增重不可控?试试 OneAPM Cloud Test
    提高 ASP.NET Web 应用性能的 24 种方法和技巧
    OneAlert 入门(三)——事件分析
    Cloud Insight 客户案例-晨芯时代科技有限公司
    Java开发快速上手
    微信小程序快速开发上手
    微信小程序快速开发上手
  • 原文地址:https://www.cnblogs.com/sovf/p/4308876.html
Copyright © 2011-2022 走看看