Question

我的问题如下：

我有类似HTML CODE的内容：

<div class="rsContent">
  <div class="rsImg" style="width:900px;height:900px; margin-left:-450px; margin-top: -450px;"></div>
  <div class="rsABBlock"></div>
  <div class="rsABBlock"></div>
</div>
<div class="rsContent">
  <div class="rsImg" style="width:1200px;height:1200px; margin-left:-600px; margin-top: -600px;"></div>
  <div class="rsABBlock"></div>
  <div class="rsABBlock"></div>
  <div class="rsABBlock"></div>
</div>

所以我想要做的是获取.rsImg容器的样式属性并将其放在.rsABBlock下面的.rsImg元素中，但仅限于同一个.rsContent {1}}容器

因此，在运行我要查找的代码后，结果应如下所示：

<div class="rsContent">
  <div class="rsImg" style="width:900px;height:900px; margin-left:-450px; margin-top: -450px;"></div>
  <div class="rsABBlock" style="width:900px;height:900px; margin-left:-450px; margin-top: -450px;"></div>
  <div class="rsABBlock" style="width:900px;height:900px; margin-left:-450px; margin-top: -450px;"></div>
</div>
<div class="rsContent">
  <div class="rsImg" style="width:1200px;height:1200px; margin-left:-600px; margin-top: -600px;"></div>
  <div class="rsABBlock" style="width:1200px;height:1200px; margin-left:-600px; margin-top: -600px;"></div>
  <div class="rsABBlock" style="width:1200px;height:1200px; margin-left:-600px; margin-top: -600px;"></div>
  <div class="rsABBlock" style="width:1200px;height:1200px; margin-left:-600px; margin-top: -600px;"></div>
</div>

我想要的代码只需要执行一次。这就是我试过的

jQuery(".rsContent").each(function(){
    var style_var = jQuery(".rsImg").attr("style");
    jQuery(".rsABBlock").each(function(){
        jQuery(this).attr("style",style_var);
    }); 
});

Answer 1

试试这个

jQuery(".rsContent").each(function(){    
    var style_var = jQuery(this).find(".rsImg").attr("style");   
    jQuery(this).find(".rsABBlock").each(function(){     
        jQuery(this).attr("style",style_var);    
    }); 
})

您必须添加this .... jQuery(this).find

Answer 2

您可以使用更少的代码执行此操作

    jQuery(".rsImg").each(function(){    
        jQuery(this).siblings().attr('style', jQuery(this).attr("style"));
        // or if there are other siblings and you need to specify rsABBlock
        // jQuery(this).siblings(".rsABBlock").attr('style', jQuery(this).attr("style"));
    })

http://jsfiddle.net/Pj8mY/1/

但是为了调试您的原始文件，您错过了.find(".rsImg")中的句点，您需要做的就是使用each <定位jQuery(this).find()循环中的那些子元素/ p>

    jQuery(".rsContent").each(function(){    
        var style_var = jQuery(this).find(".rsImg").attr("style");
        jQuery(this).find(".rsABBlock").each(function(){     
            jQuery(this).attr("style",style_var);    
        }); 
    })

工作演示：http://jsfiddle.net/Pj8mY/

Answer 3

你的内部“.rsABBlock”应该从你正在迭代的当前“.rsImg”开始。

jQuery("div.rsContent > div.rsImg").each(function () { //Get DIV with class .rsImg which is the child of a DIV with class .rsContent
    var style_var = jQuery(this).attr("style");
    jQuery(this).siblings("div.rsABBlock").each(function () { //Iterate through the siblings, not all .rsABBlock. 
        jQuery(this).attr("style", style_var);
    });
});

如果您想要的只是替换样式，则不需要在内部循环中使用“.each”。只需使用“.attr”即可。它将被调用所有选定的元素。

jQuery("div.rsContent > div.rsImg").each(function () { //Get DIV with class .rsImg which is the child of a DIV with class .rsContent
    var style_var = jQuery(this).attr("style");
    jQuery(this).siblings("div.rsABBlock").attr("style", style_var);
});

jQuery将样式复制到另一个元素

3 个答案: