如何将HTML中动态图片URL存入数组并在jQuery脚本中使用

没问题，我来帮你把这事儿搞定！你已经完成了元素获取和数组反转的核心步骤，接下来只需要提取每个<span>里的图片URL内容即可，给你几种实用方案参考：

方案1：结合jQuery完成提取 #

既然你已经用到了jQuery.makeArray()，可以直接用jQuery的map()方法快速提取文本：

var elems = document.getElementsByClassName("slider-images");
var arr = jQuery.makeArray(elems);
arr.reverse();
// 提取每个span的文本内容到新数组
var imageUrls = $.map(arr, function(elem) {
  return elem.textContent.trim(); // trim()去除多余空格/换行
});

方案2：纯JavaScript实现（无需jQuery） #

如果不想依赖jQuery，用原生JS也能轻松完成，代码更轻量：

var elems = document.getElementsByClassName("slider-images");
// 把HTMLCollection转成数组（替代jQuery.makeArray）
var arr = Array.from(elems); 
arr.reverse();
// 遍历数组提取文本
var imageUrls = arr.map(elem => elem.textContent.trim());

兼容旧浏览器的纯JS写法 #

如果需要兼容不支持Array.from()的旧浏览器，可以用slice()方法转数组：

var elems = document.getElementsByClassName("slider-images");
var arr = [].slice.call(elems);
arr.reverse();
var imageUrls = arr.map(function(elem) {
  return elem.textContent.trim();
});

关键说明 #

• textContent：用来获取元素的纯文本内容，能准确拿到span里的图片文件名；
• trim()：可选但推荐，去除文本前后可能存在的空格、换行符，保证URL的整洁性；
• 最终imageUrls数组里就存储了反转后的所有图片URL，可以直接用于后续的动态图片处理。

内容的提问来源于stack exchange，提问作者user715564