Javascript 将特定文本保存在单独的div中，并加载随机图像

我目前有一些脚本，当用户刷新页面时，它会随机化图像

var large_images = [
  "wp-content/themes/workroomv2/images/headshot1.jpg",    
  "wp-content/themes/workroomv2/images/headshot2.jpg",    
  "wp-content/themes/workroomv2/images/headshot3.jpg",    
  "wp-content/themes/workroomv2/images/large1.jpg",   
  "wp-content/themes/workroomv2/images/large2.jpg",   
  "wp-content/themes/workroomv2/images/large3.jpg" 
];

var arr = [];

$.each(large_images,
  function(i, el) {
    setTimeout(function() {
      arr.push(el);
      if (arr.length === large_images.length) {
        $(".item.large img")
          .attr("src", function(i, src) {
            return arr[i]
        })
    }
   }, 1 + Math.floor(Math.random() * 5))
 });

不过，我希望在图像中保留某些内容，因为这是在描述团队成员（名称、内容、按钮）。在思考之后，按照上面的方法操作，但是由于文本是随机的，所以文本不起作用。HTML结构如下所示。我需要在每个跨距中输入文本

    <div class="item">
        <div class="inner">
            <a href="#">
                <img id="" class="people" src="" alt="test">
                <div class="text">
                    <span class="title"></span>
                    <span class="sub-title"></span>
                    <span class="content"></span>
                </div>
            </a>
        </div>
    </div>

---

我不知道在图像随机化时如何将内容保存在哪里。任何关于这方面的建议都会很好

创建对象数组并使用索引设置文本，下面是一个示例

//Create an array of object with all the required data
var large_images = [{
    src: "wp-content/themes/workroomv2/images/headshot1.jpg",
    title: "yahooo"
}, {
    src: "wp-content/themes/workroomv2/images/headshot2.jpg",
    title: "google"
}];

//When iterating also set the text using the array element
$(".item.large img").attr("src", function(i, src) {

  //Find the title span which is child of images siblings
  $(this).next('.text').find('.title').text(arr[i].title);

  return arr[i].src
})

jQuery（函数（$）{
变量大_图像=[{
src:“wp content/themes/workroomv2/images/headshot1.jpg”，
标题：“yahooo”
}, {
src:“wp content/themes/workroomv2/images/headshot2.jpg”，
标题：“谷歌”
}];
var-arr=[]；
$。每个（大图像、函数（i、el）{
setTimeout（函数（）{
方位推力（el）；
if（arr.length==大图像长度）{
$（“.item.large img”）.attr（“src”，函数（i，src）{
//查找标题范围，它是图像的子级
$（this）.next（'.text'）.find（'.title'）.text（arr[i].title）；
$（this.attr（'alt'，arr[i].src）；
返回arr[i].src
})
}
}，1+数学地板（数学随机（）*5））
});
});

您已经了解了如何使用图像索引…为什么内容会有所不同？请详细说明你现在在哪里，这很有意义！我真的不明白它是如何在数组中完成的，但我现在知道了