react理解(一)jsx

ssssslf發表於2018-07-06
//對jsx執行的理解
/**
*@param dom  :document.createElement('div')
*@param name : className / style/onClick等
*@value : string:"classTest"/"color:red; font-size:13px;"  /object:{height:50,color:"red"}
*/
function setAttribute(dom,name,value){
    if(name === 'className') name = 'class';
    if(/on\w+/.test(name)){
         name = name.toLowerCse();
        dom[name] = value;
    }else if(name === 'style'){
        if(value&&typeof value === ' object'){
            for(let i of value){
               dom.style[ i ] = typeof value[ i ] === 'number' ? value[ i ] + 'px' : value[ i ];
            }
        }else if(!typeof value === 'string'){
            dom.style.cssText = value
        }else if(!value){
            dom.style.cssText = '';
        }
    }else{
        if(value)dom.setAttribute( name, value );
        else dom.removeAttribute(name);
    }
}
複製程式碼

相關文章