Question

我的网站上有这段代码，我无法编辑：

<ul class="parent">
  <li>
    <a href="">
      <img src="/105-158/someName.png">
    </a>
  </li>
  <!-- a bunch more of those li's -->
</ul>

我想阅读所有src，找到'105-158'将其更改为'1920-2880'并将其存储在某处以备将来使用。我不想改变DOM！

我做到了这一点，但我只能使用console.log：

var imageList = document.querySelectorAll('.parent > li > a > img').forEach(i => console.log(i.src.replace('105-158', '1920-2880')))

然后，当我点击相应的图像时，将其设置为currentImage。

Answer 1

您说您想要不更改源，但将新源保存在某处，以便您可以引用它。最简单的方法是使用数据属性来存储它。

var imageList = document.querySelectorAll('.parent > li > a > img')
imageList.forEach(img => img.dataset.src = img.src.replace('105-158', '1920-2880'))
console.log(imageList[2].dataset.src)

如果你真的想要它作为数组使用map（）

var imageList = document.querySelectorAll('.parent > li > a > img')
var srcs = Array.from(imageList).map(img => img.src.replace('105-158', '1920-2880'))

读取属性，找到它的一部分，更改它并存储在某个地方

1 个答案: