반응형

base ui class

       function BDBUI(){
            this.templete, 
            this._popup, 
            this.popup, 
            this.callback = null
        }
        BDBUI.prototype.init = function(){
            this._popup = this._stringToHTML(this.templete)
        }
        BDBUI.prototype.show = function(){
            this.hide()
            this.popup = this._popup.cloneNode(true)
            document.body.appendChild(this.popup)
        }
        BDBUI.prototype.has = function(){
            return this.popup
        }
        BDBUI.prototype.hide = function(){
            if (this.has()){
                while(this.popup.firstChild){
                    this.popup.firstChild.remove()
                }
                this.popup.remove()
                this.popup = null
                return true
            } else {
                return false
            }
        }
        BDBUI.prototype._stringToHTML = function (str) {
            var parser = new DOMParser();
            var doc = parser.parseFromString(str, 'text/html');
            return doc.body.firstChild;
        }
        BDBUI.prototype.copy = function(obj){
            return Object.assign({}, obj);
        }

sub ui class 

        function SubUI(){
            BDBUI.call(this)
            this.templete = "<div></div>"
        }
        SubUI.prototype = Object.create(BDBUI.prototype)
        SubUI.prototype.constructor = SubUI
        //custom function
        SubUI.prototype.sd = function(){
            console.log(this.templete)
        }

 

sub ui class 호출

        const subui = new SubUI()
        subui.init()
        subui.sd()
        subui.show()
        console.log(subui)

 

반응형

+ Recent posts