添加宽度和高度动态div与jquery

Question

我在jquery中插入一个div到一个图像包装，根据条件（这没有重要性），我有这样的工作方式应该，但问题是，我想要给这个div一个宽度和一个高度，这取决于它以前的兄弟姐妹的图像。 不知道是否可以添加一个宽度和高度，就像我正在做一个在jQuery中创建的div。

<div class="imageWrap imageWrap2"> 
    <img src="images/image1" class="image" /> 
</div> 

与代码标记看起来如下：

<div class="imageWrap imageWrap2"> 
    <img src="images/image1" class="image" /> 
    <div class="extraDiv"></div><-- <-- added with jquery --> 
</div> 

jQuery的我加入了（再次条件是不重要的，也不是在配售事项后，追加插入等）

$('.image').each(function(){ 

    if ($(this).closest('.imageWrap').hasClass('imageWrap'){ 

     $(this).after('<div class="extraDiv"></div>'); 

      var imageWidth = $(this).prev().width(); 
      var imageHeight = $(this).prev().height(); 

      $('.extraDiv').width(imageWidth).height(imageHeight);  

    } 

}); 

有人可以告诉我如何获得每个图像的宽度并将其应用于extraDiv。

非常感谢。

Answer 1

试试这个吗？ （有点很难知道它是否会没有小提琴或plunkr工作）：

$('.image').each(function(){ 
    var imageWidth = $(this).width(); 
    var imageHeight = $(this).height(); 
    $(this).closest('.imageWrap').append('<div class="extraDiv"></div>'); 
    $(this).siblings('.extraDiv').width(imageWidth); 
    $(this).siblings('.extraDiv').height(imageHeight); 
}); 

OR：

$('.image').each(function(){ 
    var imageWidth = $(this).width(); 
    var imageHeight = $(this).height(); 
    $(this).closest('.imageWrap').append('<div class="extraDiv" style="width:' + imageWidth + 'px;height:' + imageHeight + 'px;"></div>'); 
}); 

Plunkr

所以第一关你并不真正需要的if语句在那里，因为通过应用closest(className)函数，您已经检查它是否具有该类名称。由于$('.extraDiv')将以extraDiv作为其班级更新所有班级，所以我不认为这就是你想要在这里做的事情，所以你会遇到if里最后一条语句的问题。