2012-05-16 44 views
-2

在jQuery的1.4.1源,這個CSS功能是:jQuery - 有人可以給我一個jQuery 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功能的獨立代碼?

+3

除非你只想設置簡單的屬性,這是不平凡的。 – ThiefMaster

回答

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; 
    } 
}; 
相關問題