为了在非5+的浏览器支持子页面功能， 准备造个fake plus的轮子

非5+页面，可以用Iframe 模拟多页面，这样可以在PC浏览器打开APP页面。
今天只是简单搞了一下plus.webview, 的create，hide，show
看看大家有没有兴趣，可以考虑发布一个完整的轮子，方便多端发布

var PlusWebview = {}  

    function PlusIframe(plus) {  
        function IframeView(id){  
            this.id = id  
        }  
        IframeView.fn = IframeView.prototype  
        IframeView.fn.create = function(opt){  
            var self = this  
            self.url = opt.url  
            self.style = opt.style  
            self.iframe = createIframe('.mui-content', opt)  
            //createIframe2(self.id)  
            return self  
        }  
        IframeView.fn.show = function(){  
            this.iframe.style.display = "block"  
        }  
        IframeView.fn.hide = function(){  
            this.iframe.style.display = "none"  
        }  
        IframeView.fn.evalJS = function(js){  
            var win = this.iframe.window || this.iframe.contentWindow;  
            win.eval(js)  
        }  

        plus.webview.getWebviewById = function(id){  
            return PlusWebview[id]  
        }  
        plus.webview.create = function(url, id, style) {  
            var v = new IframeView(id)  
            PlusWebview[id] = v.create({url: url, id: id, style: style} )  

            return v  
        }  
        plus.webview.show = function(id) {  
            //hide others  
            for (var _id in PlusWebview){  
                if(_id == id){  
                    PlusWebview[_id].show()  
                }else{  
                    PlusWebview[_id].hide()  
                }  

            }  
        }  
        plus.webview.hide = function(id) {  
            PlusWebview[id].hide()  
        }  
    }  
var createIframe = function(el, opt) {  
        var elContainer = document.querySelector(el);;  

        var wrapper = document.querySelector(".mui-iframe-wrapper");  
        if(!wrapper) {  
            // 创建wrapper 和 iframe  
            wrapper = document.createElement('div');  
            wrapper.className = 'mui-iframe-wrapper';  
            if(typeof opt.style.top !== 'string') {  
                opt.style.top = '0px';  
            }  
            if(typeof opt.style.bottom !== 'string') {  
                opt.style.bottom = '0px';  
            }  

            for(var i in opt.style) {  
                wrapper.style[i] = opt.style[i];  
            }  
            elContainer.appendChild(wrapper);  
        }  
        var iframe = document.createElement('iframe');  
        iframe.src = opt.url;  
        iframe.id = getIframeId(opt.id);  
        iframe.name = opt.id;  
        wrapper.appendChild(iframe);  
        return iframe  
    }