>[info][AHelper.js](http://git.oschina.net/winu.net/AHelper.js)包含了api.js和avalidate.js，无需引用这两个文件。 [AHelper.js](http://git.oschina.net/winu.net/AHelper.js)内置了模板引擎tppl，也许你该把doT.js换下去了。- v -。 ***** - 下载源码：[git@osc](http://git.oschina.net/winu.net/AHelper.js) ``` http://git.oschina.net/winu.net/AHelper.js ``` - 在项目中引用 ``` <script type="text/javascript" src="./script/AHelper.js"></script> ``` - 编写加载事件，建议所有的代码都写在`H.ready(function(){})`中。 ``` <script type="text/javascript"> H.ready(function() { // 你的代码 }); </script> ``` - 来，我们用用看，在首页打开一个frame，并设置为沉浸式效果。 1、设置`config.xml`属性为沉浸式效果 ``` <preference name="statusBarAppearance" value="true"/> <preference name="iOS7StatusBarAppearance" value="true"/> <preference name="softInputMode" value="resize"/> ``` 2、使用`AUI`前端框架，非常感谢`流浪男`的分享，[AUI官方地址](http://www.auicss.com) ``` <link rel="stylesheet" type="text/css" href="./css/auicss/aui-win.css" /> ``` 3、编写导航栏，底部栏目 ``` <header class="aui-bar aui-bar-nav aui-bar-dark" id='aui-header'> <div class="aui-title"> 顶部导航栏 </div> </header> <footer class="aui-nav" id="aui-footer"> <ul class="aui-bar-tab"> <li class="active-warning" id="tabbar1"> <span class="aui-iconfont aui-icon-favor"></span> <p> 栏目1 </p> </li> <li id="tabbar2" > <span class="aui-iconfont aui-icon-mark"></span> <p> 栏目2 </p> </li> <li id="tabbar3"> <span class="aui-iconfont aui-icon-like"></span> <p> 栏目3 </p> </li> <li id="tabbar4"> <span class="aui-iconfont aui-icon-my"></span> <p> 栏目4 </p> </li> </ul> </footer> ``` 4、引用`AHelper.js` ``` <script type="text/javascript" src="./script/AHelper.js"></script> ``` 5、编写脚本 ``` <script type="text/javascript"> H.ready(function() { // 快速打开窗口 H.$openFrameWithNav('aui-header', { url : './html/main.html', name : 'main' }, 'aui-footer'); }); </script> ``` - 来，看看效果