jQuery - 有人可以给我一个jQuery css函数的独立代码吗?

时间:2012-05-16 06:05:46

标签: jquery css

在jquery 1.4.1源代码中,这个css函数是:

css: function( elem, name, force, extra ) {
        /// <summary>
        ///     This method is internal only.
        /// </summary>
        /// <private />

        if ( name === "width" || name === "height" ) {
            var val, props = cssShow, which = name === "width" ? cssWidth : cssHeight;

            function getWH() {
                val = name === "width" ? elem.offsetWidth : elem.offsetHeight;

                if ( extra === "border" ) {
                    return;
                }

                jQuery.each( which, function() {
                    if ( !extra ) {
                        val -= parseFloat(jQuery.curCSS( elem, "padding" + this, true)) || 0;
                    }

                    if ( extra === "margin" ) {
                        val += parseFloat(jQuery.curCSS( elem, "margin" + this, true)) || 0;
                    } else {
                        val -= parseFloat(jQuery.curCSS( elem, "border" + this + "Width", true)) || 0;
                    }
                });
            }

            if ( elem.offsetWidth !== 0 ) {
                getWH();
            } else {
                jQuery.swap( elem, props, getWH );
            }

            return Math.max(0, Math.round(val));
        }

        return jQuery.curCSS( elem, name, force );
    },

    curCSS: function( elem, name, force ) {
        /// <summary>
        ///     This method is internal only.
        /// </summary>
        /// <private />

        var ret, style = elem.style, filter;

        // IE uses filters for opacity
        if ( !jQuery.support.opacity && name === "opacity" && elem.currentStyle ) {
            ret = ropacity.test(elem.currentStyle.filter || "") ?
                (parseFloat(RegExp.$1) / 100) + "" :
                "";

            return ret === "" ?
                "1" :
                ret;
        }

        // Make sure we're using the right name for getting the float value
        if ( rfloat.test( name ) ) {
            name = styleFloat;
        }

        if ( !force && style && style[ name ] ) {
            ret = style[ name ];

        } else if ( getComputedStyle ) {

            // Only "float" is needed here
            if ( rfloat.test( name ) ) {
                name = "float";
            }

            name = name.replace( rupper, "-$1" ).toLowerCase();

            var defaultView = elem.ownerDocument.defaultView;

            if ( !defaultView ) {
                return null;
            }

            var computedStyle = defaultView.getComputedStyle( elem, null );

            if ( computedStyle ) {
                ret = computedStyle.getPropertyValue( name );
            }

            // We should always get a number back from opacity
            if ( name === "opacity" && ret === "" ) {
                ret = "1";
            }

        } else if ( elem.currentStyle ) {
            var camelCase = name.replace(rdashAlpha, fcamelCase);

            ret = elem.currentStyle[ name ] || elem.currentStyle[ camelCase ];

            // From the awesome hack by Dean Edwards
            // http://erik.eae.net/archives/2007/07/27/18.54.15/#comment-102291

            // If we're not dealing with a regular pixel number
            // but a number that has a weird ending, we need to convert it to pixels
            if ( !rnumpx.test( ret ) && rnum.test( ret ) ) {
                // Remember the original values
                var left = style.left, rsLeft = elem.runtimeStyle.left;

                // Put in the new values to get a computed value out
                elem.runtimeStyle.left = elem.currentStyle.left;
                style.left = camelCase === "fontSize" ? "1em" : (ret || 0);
                ret = style.pixelLeft + "px";

                // Revert the changed values
                style.left = left;
                elem.runtimeStyle.left = rsLeft;
            }
        }

        return ret;
    }

但它不能单独使用,谁可以给我一个css函数的独立代码?

1 个答案:

答案 0 :(得分:1)

不,jQuery非常复杂,所以你不能只从源代码中获取一个方法并使用它。

您可以编写一个简单的CSS函数,如:

var css = function(element, property, value) {
    element.style += '; ' + property + ':' + value;
};

或者使用哈希来制作:

var css = function(element, property, value) {
    if (typeof property == 'object' && value === undefined) {
        // handle css(elem, { prop : value });
        var styles = '';
        for (i in property) {
            styles += '; ' + i + ':' + property[i];
        }
        element.style += styles;
    }
    else {
        // handle css(elem, prop, value);
        element.style += '; ' + property + ':' + value;
    }
};