jQuery 之异步加载并执行 js 文件

使用 getScript() 方法异步请求并执行服务器中的 JavaScript 格式的文件,它的调用格式如下所示:

jQuery.getScript(url,[callback])
  

$.getScript(url,[callback])
  

参数 url 为服务器请求地址,可选项 callback 参数为请求成功后执行的回调函数。

使用示例

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>使用getScript()方法异步加载并执行js文件</title>
        <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
        <link href="style.css" rel="stylesheet" type="text/css" />
    </head>

    <body>
        <div id="divtest">
            <div class="title">
                <span class="fl">我最喜欢的运动</span>
                <span class="fr">
                    <input id="btnShow" type="button" value="加载" />
                </span>
            </div>
            <ul></ul>
        </div>

        <script type="text/javascript">
            $(function () {
                $("#btnShow").bind("click", function () {
                    var $this = $(this);
                    $.getScript("/script/test.js",function(){
                        $this.attr("disabled", "true");
                    });
                })
            });
        </script>
    </body>
</html>
  

关于这个函数,值得一提的还有下面的东西

  1. jQuery.getScript() 函数用于通过 HTTP GET 形式的加载 JavaScript 文件并运行它。
  2. 该函数用于动态加载 JS 文件,并在全局作用域下执行文件中的 JS 代码。
  3. 该函数可以加载跨域的 JS 文件。请注意,该函数是通过异步方式加载数据的。
  4. 该函数属于全局 jQuery 对象。