根据需要加载javascript依赖项

Question

我确信这个问题有不同的方法,我可以想到一些.但我想听听其他人对此的看法.更具体地说,我已经构建了一个小部件,允许用户从谷歌地图中选择他们的位置.此小部件按需显示,并且可能会在其放置的页面的每10次使用中使用.加载此窗口小部件(google maps js api)的依赖项的最简单方法是在页面中放置一个脚本标记.但这会使浏览器请求加载每个页面上的脚本.我正在寻找一种方法,只有当用户需要显示小部件时,才能使浏览器请求该脚本.

Answer 1

function loadJSInclude(scriptPath, callback)
{
    var scriptNode = document.createElement('SCRIPT');
    scriptNode.type = 'text/javascript';
    scriptNode.src = scriptPath;

    var headNode = document.getElementsByTagName('HEAD');
    if (headNode[0] != null)
        headNode[0].appendChild(scriptNode);

    if (callback != null)    
    {
        scriptNode.onreadystagechange = callback;            
        scriptNode.onload = callback;
    }
}

并使用(我使用swfObject作为例子):

var callbackMethod = function ()
{
    // Code to do after loading swfObject
}

// Include SWFObject if its needed
if (typeof(SWFObject) == 'undefined')    
    loadJSInclude('/js/swfObject.js', callbackMethod);
else
    callbackMethod();