function render(element,container){
    if(typeof element == 'string' || typeof element == 'number'){   //如果element是一個普通的字符串或者數(shù)字，就創(chuàng)建文本節(jié)點并添加進去
        container.appendChild(document.createTextNode(element));
    }
    //這里是因為在執(zhí)行React.createElement()方法之后返回的element元素包含了type、props屬性
    let type = element.type;   // 獲取react元素的類型
    let props = element.props;   //獲取react元素的屬性
    if(typeof type === 'function'){
        let renderedElement;
        if(type.isReactComponent){  //說明是一個類組件
            let inst = new type(props);
            renderedElement = inst.render();  //調(diào)用class的render方法返回react元素
        }else{  //函數(shù)組件
            renderedElement = type(props);
        }
        type = renderedElement.type;
        props = renderedElement.props;
    }

    //創(chuàng)建react元素
    let domElement = document.createElement(type);
    for(let propName in props){
        if(propName == 'className'){
            domElement.className = props[propName];
        }else if(propName == 'style'){
            let styleObj = props[propName];
            for(let attr in styleObj){
                domElement.style[attr] = styleObj[attr];
            }
        }else if(/^on[A-Z]/.test(propName)){  //處理react事件
            domElement[propName.toLowerCase()] = props[propName];
        }else if(propName == 'children'){
            let children = Array.isArray(props.children) ? props.children : [props.children];
            children.forEach(child => render(child,domElement));
        }
    }
    container.appendChild(domElement);
}

export default {
    render
}