jQuery獲取基於正則表達式的css屬性

Question

我想爲應用程序構建一些自定義js，並且我需要從父項目中複製一些css樣式。

... 
match_properties: ['background-color', 'border-radius', 'margin'], 
... 

var custom_css = []; 
$(params['match_properties']).each(function(i, v) { 
    custom_css.push(v+': '+$(params['object']).css(v)); 
}); 
custom_css = custom_css.join('; '); 

css_properties = css_properties + custom_css + ';'; 

反正從jQuery來得到所有從項目（'moz-border-radius'，'webkit....'）的'border-radius'屬性？

的一點是，不要做類似下面，用手

if(params['match_properties']['border-radius']) { 
    custom_css.push('-moz-border-radius: '+$(params['object'].css('-moz-border-radius'))) 
    custom_css.push('-webkit-border-radius: '+$(params['object'].css('-webkit-border-radius'))) 
} 

和理由不這樣做，因爲這將是更有效，只是通過'border-radius'，'box-shadow'，或者是什麼以往，並得到所有相關

Answer 1

我落得這樣做：

var custom_css = []; 
$.each($(params['match_properties']), function(i, v) { 
    custom_css.push(selectr($(params['object']), v)); 
}); 
custom_css = custom_css.join('; '); 


function selectr(element, selector) { 
    var selectors = { 
     browser: ['border-radius', 'box-shadow'], 
     shorthand: ['margin', 'border'], 
    } 

    var my_css = []; 

    if($.inArray(selector, selectors.browser) > -1) 
    { 
     my_css.push('-webkit-'+selector+': '+$(element).css('-webkit-'+selector)); 
     my_css.push('-moz-'+selector+': '+$(element).css('-moz-'+selector)); 
     my_css.push(selector+': '+$(element).css(selector)); 
    } 
    else if($.inArray(selector, selectors.shorthand) > -1) 
    { 
     my_css.push(selector+': ' + 
      $(element).css(selector+'-top') + ' ' + 
      $(element).css(selector+'-right') + ' ' + 
      $(element).css(selector+'-bottom') + ' ' + 
      $(element).css(selector+'-left') 
     ); 
    } 
    else 
    { 
     my_css.push(selector+': '+$(element).css(selector)); 
    } 

    return my_css; 
} 

Answer 2

在jQuery的1.9屬性及更高版本：

var props = $('whatever').css(['background-color', 'width', 'font-size']); 

與propertie返回一個對象s對應於你要求的CSS屬性。