获取图像SRC值的一堆图像

Question

我有一个div里面有一堆<img>元素。我希望能够在jQuery中存储<src>值，然后在DOM的其他地方注入这些src值。

基本上，我想从下面得到img src的值:

<div class="newHomeHeroCarouselFetchedIMGs">
<img src="example.jpg">
<img src="chicken.jpg">
<img src="hope.jpg">
</div>

然后将它们注入到'markup'模板的下面位置，如下所示:

<div class="targetLocation">
<div style="background-image: example.jpg"></div>
<div style="background-image: chicken.jpg"></div>
<div style="background-image: hope.jpg"></div>
</div>

new whomeherocarouselfetchedimg "Div是未知的，可以是1，可以是10....对于出现在newwhomeherocarouselfetchedimg "中的每个imgdiv -我需要在"targetlocation"中添加另一个<div style="background-image: IMGSRC.jpg"></div>div .

我想我需要创建一个数组并将img src值传递到其中，然后根据数组循环中的项目数量输出标记并将img src注入背景图像样式属性-我只是不确定如何实现它!

Answer 1

这对你有用吗?

$('newHomeHeroCarouselFetchedIMGs > img').each(function() {
let src = $(this).attr('src');
$('div.targetLocation').append( $(`<div style="background-image: ${src}" />`) );
});