1

我正在尝试为应用程序构建一些自定义 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 是否可以从项目（ ， ）中获取所有'border-radius'属性？'moz-border-radius''webkit....'

关键是，不要手动执行以下操作

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'或任何东西并获取所有相关的属性会更有效率

4

2 回答 2

1

在 jQuery 1.9 及更高版本中：

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

这将返回一个对象，其属性对应于您要求的 CSS 属性。

于 2013-05-27T14:58:15.453 回答
0

我最终这样做了：

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;
}
于 2013-05-27T17:48:11.207 回答