Google 的 jsapi 有个 load 功能，就是我们只需要引入一个 loader.js，然后再执行 load 函数，就可以直接使用相应的 application 的 api，这跟以前是每使用一个 api 就需要使用 script 引入一个 js 文件相比，不仅方便了许多，而很利于部署和维护。
下面说说类似的实现方式，本例有四个文件：一个 loader.js，两个具体的 application 的 api 文件，一个应用页面。
loader.js
function Cftea()
{
}
function Cftea_load(applicationName, applicationVersion)
{
if (applicationName == "app1")
{
if (applicationVersion == "1.0")
{
Cftea_loadScript("app1.js");
}
}
else if (applicationName == "app2")
{
if (applicationVersion == "1.0")
{
Cftea_loadScript("app2.js");
}
}
}
function Cftea_loadScript(url)
{
var script = document.createElement("script");
script.setAttribute("type", "text/javascript");
script.setAttribute("src", url);
document.body.appendChild(script);
}
Cftea.prototype.load = Cftea_load;
Cftea.prototype.onApp1LoadComplelte = null;
Cftea.prototype.onApp2LoadComplelte = null;
var cftea = new Cftea();
app1.js
function Cftea_App1()
{
this.name = "app1";
}
Cftea.prototype.app1 = new Cftea_App1(); //为 Cftea 增加成员
cftea.onApp1LoadComplelte(); //触发读取完毕事件
app2.js
function Cftea_App2()
{
this.name = "app2";
}
Cftea.prototype.app2 = new Cftea_App2(); //为 Cftea 增加成员
cftea.onApp2LoadComplelte(); //触发读取完毕事件
应用页面
<!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>api</title>
</head>
<body>
<div style="height:50px;"></div>
<div id="guestbook"></div>
<script type="text/javascript" src="loader.js"></script>
<script type="text/javascript">
<!--
cftea.onApp1LoadComplelte = function ()
{
alert("app1 读取完毕，可以使用 cftea.app1 对象。\r\ncftea.app1.name=" + cftea.app1.name);
}
cftea.onApp2LoadComplelte = function ()
{
alert("app2 读取完毕，可以使用 cftea.app2 对象。\r\ncftea.app2.name=" + cftea.app2.name);
}
cftea.load("app1", "1.0");
cftea.load("app2", "1.0");
-->
</script>
</body>
</html>
可以看到，在读取了相应的 application 的 api 之后，全局对象 cftea 就自动增加相应的成员，可以直接使用该对象。
