jquery 获取 img src 并在另一个 div 中添加为背景

Question

我正在尝试获取 div 中第一个 img 的图像 src，并将其作为背景添加到另一个 div。

<ul class="list-parent">  
<li>
  <!-- add div with background img here -->
  <div class="img-parent">  
    <img src="image src origin">
    <img src="ignore this image">
    <img src="ignore this image">
  </div>
</li>
<li>
  <!-- add div with background img here -->
  <div class="image-parent">  
    <img src="image src origin">
    <img src="ignore this image">
    <img src="ignore this image">
  </div>
</li>
</ul>

我做了类似的事情：

var rssimg = $('.image-parent img:first-child').attr('src');
$('.img-target li').prepend('<div class="img-target" style="background-image:url(' + rssimg + ')"></div>');

但我只获取第一个 .image-parent 的第一个图像的来源，而不是其直接父级中每个第一个图像的第一个 src。

我已经搜索了几个小时并尝试了不同的方法，但到目前为止没有任何效果。我几乎是 JQuery 的新手，但我很确定有一个解决方案。

我们将不胜感激您的专业知识。

Answer 1

你需要 $.map 和 $.get

的东西

var rssimg = $('div[class$=parent] img:first-child').map(function(){
    return this.src;
}).get();

现在 rssimg 是一个 Array，其元素是图像的 url，这些图像是 <div> 的后代，class 以父级结尾，它们可以被索引访问。

jquery 获取 img src 并在另一个 div 中添加为背景

jquery get img src and add as background in another div

html

jquery