javascript - 将图像大小传递给周围 div 的 if else 语句

Question

在我的网站上，主要内容中的所有图像都被包装到一个 div 容器中，如下所示：

<div class="imagecontainer">
  <img src="image.jpg" width="300" />
</div>

我需要将图像宽度添加到其周围的 div 中。这适用于：

$('.imagecontainer').each(function() {
  $(this).width( $(this).find('img').attr('width') );
});

但仅当图像具有宽度属性时。如果我使用 width() 元素而不是 attr('width') ，则所有没有 width 属性的图像都显示宽度为 0。

我还尝试了几个 if-else 语句来检查：

1. 如果图像具有宽度属性，则将其添加到其周围的 div 中。
2. 否则使用图像显示的宽度并将其添加到其周围的 div 中。

但没有成功。

有没有办法抓取显示的图像大小并将其添加到其周围的 div 中？

Answer 1

Using.width() 是正确的方法，但是您必须等待窗口到load，以便在运行代码时已经加载了图像：

$(window).on('load', function () {
    $('.imagecontainer').each(function() {
        $(this).width( $(this).find('img').width() );
    });
});

您可能应该缓存该$(this)对象。