javascript - 按需加载javascript依赖项

我敢肯定有不同的方法来解决这个问题，我可以想到一些。但我想听听其他人对此的看法。更具体地说，我构建了一个小部件，允许用户从google map 上选择他们的位置。该窗口小部件将按需显示，并且可能会在放置该页面的10个用途中每1个使用一次。加载此小部件(google maps js api)的依赖项的最简单方法是在页面中放置脚本标签。但这会使浏览器在每次加载页面时都请求该脚本。我正在寻找一种仅当用户要求显示小部件时才使浏览器请求该脚本的方法。

最佳答案

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();