底部导航菜单切换，并返回首页的实现

实现nav导航，与子页面切换
文档参考：http://dcloudio.github.io/mui/javascript/#subpage

在html添加数个导航，在js中，为这些导航批量添加事件，在点击的时候打开子页面。子页面无底部导航，共用父页面的底部导航。
父子页面共用底部导航，在预加载的地方，使用styles.bottom即可

复杂的地方在于，切换为首页时，要保持首页的状态，则需要显示应用初始化时候的状态，则需要找到当前父页面的id并进行展示

        $.page_nav = function() {  
            navs = document.querySelectorAll(".mui-tab-item");  
            for(n in navs)  
            {  
                obj = navs[n] .getAttributeNode("id").value;  
                app_debug && console.log(obj);  

                if(obj != 'page_index') {  
                    $.preload({  
                        "id": obj,  
                        "url": obj.replace("page_", "")+'.html',  
                        "styles":{  
                            top:'0px',//mui标题栏默认高度为45px  
                            bottom: '50px',//mui导航栏默认高度为50px  
                        }  
                    });  
                }  

                document.getElementById(obj).addEventListener("tap", function(){  
                    if(this.id == 'page_index') {  
                        //获得主页面的webview  
                        var main = plus.webview.currentWebview();  
                        mui.openWindow({"id":main.id});  
                    } else {  
                        mui.openWindow({  
                            "id":this.id,  
                            "crateNew":false,  
                            "styles":{  
                                top:'0px',//mui标题栏默认高度为45px  
                                bottom: '50px'//默认为0px，可不定义  
                            }  
                        });  
                    }  
                }, false);  
            }  
        }  

        //底部导航菜单绑定  
        $.page_nav();

    <nav class="mui-bar mui-bar-tab">  
        <a class="mui-tab-item mui-active" id="page_index" target="index.html">  
            <span class="mui-icon icon iconfont icon-beauty">&#xe600;</span>  
            <span class="mui-tab-label">清新</span>  
        </a>  
        <a class="mui-tab-item" id="page_category" target="category.html">  
            <span class="mui-icon iconfont icon-sexy">&#xe601;</span>  
            <span class="mui-tab-label">时尚</span>  
        </a>  
        <a class="mui-tab-item" id="page_article" target="article.html">  
            <span class="mui-icon iconfont icon-meng">&#xe602;</span>  
            <span class="mui-tab-label">评论</span>  
        </a>  
        <a class="mui-tab-item" id="page_login" target="login.html">  
            <span class="mui-icon mui-icon-gear"></span>  
            <span class="mui-tab-label">设置</span>  
        </a>  
    </nav>