Question

我有一个像这样的JSON：

{
  "app_name" : "yeah",
  },
  "template" : {
    "pages" : [
      {
        "styles" : [
          {
            "background_color" : "transparent"
          },
          {
            "background_image" : "url('http://desktopbackground.in/wp-content/uploads/2014/09/Blurred-Background-for-android.jpg')"
          },
          {
            "background_size" : "cover"
          },
          {
            "background_position" : "center center"
          },
          {
            "height" : "auto"
          }
        ]
      }
    ]
  }
}

我试图使用循环动态地将页面数组中的样式应用于页面，具有以下功能：

jQuery.each(styles, function(index, style) {
         for (property in style) {
            page_content = jQuery(page_content).first('div').css(property, style[property]);
         }
})

问题是循环在每个循环之后完全替换了style属性，而是我需要保留style属性的现有内容并在每个循环中添加一个新属性，而不是替换现有的。

感谢您的帮助！

Answer 1

只是一个未经考验的想法，不确定它是否有所作为，但你尝试过.css（）的对象参数版本？像这样：

var appendCss = {};
jQuery.each(styles, function(index, style) {
    for (property in style) {
        appendCss[property] = style[property];
    }
});

page_content = jQuery(page_content).first('div').css(appendCss);

Answer 2

解决这个问题：

jQuery.each(styles, function(index, style) {
    for (property in style) {
        var original_style = jQuery(page_content).find('#'+page_id).attr('style');
        if(!original_style)
            original_style = '';
        var style = property + ':' + style[property] + ';';
        jQuery(page_content).find('#'+page_id).attr('style', style + original_style);
    }
});

jQuery在循环上设置元素样式

2 个答案: