jQuery-1.9.1源码分析系列（九） CSS操作

　　jquery.fn.css获取当前jQuery所匹配的元素中第一个元素的属性值【$(…).css(cssName),注意这个cssName可以是数组】或给当前jQuery所匹配的每个元素设置样式值【$(…).css(cssname,value) / $(…).css(obj)】;

　　可以看见函数内部直接调用了jquery.access来处理。access将当前多个元素组成的jQuery对象所匹配的元素分解成单一元素逐个调用第二个参数中的回调function( elem, name, value )；如果参数name是对象的话，access内部分解name递归调用逐个处理name的每一个key/value键值对

　　源码

jQuery.fn.css: function( name, value ) {
    //access将当前jQuery对象分解成单一元素逐个调用第二个参数中的回调function( elem, name, value )，
    //如果参数name是对象的话，access内部分解name递归调用逐个处理name的每一个key/value键值对
    return jQuery.access( this, function( elem, name, value ) {
        var len, styles,
        map = {},
        i = 0;
        //如果css特征名称是一个数组，比如['left','marginRight']
        if ( jQuery.isArray( name ) ) {
            styles = getStyles( elem );
            len = name.length;
            //通过$.css()获取对应的css特征值
            for ( ; i < len; i++ ) {
                map[ name[ i ] ] = jQuery.css( elem, name[ i ], false, styles );
            }

            return map;
        }

        //value有值则调用$.style设置单个css值，value参数无值则通过$.css()获取对应的css特征值
        return value !== undefined ?
        jQuery.style( elem, name, value ) :
        jQuery.css( elem, name );
    }, name, value, arguments.length > 1 );
}

View Code