Question

我正在开发一个Chrome扩展程序，该扩展程序需要我使用右键单击上下文保存图像。如何使用JavaScript在Chrome中复制“复制图片地址”？我只需要获取图像文件的URL。

Answer 1

也许这样会有所帮助：

window.location.origin + document.getElementById({imgId}).getAttribute('src');

Google主页上的工作示例：

window.location.origin + document.getElementById('hplogo').getAttribute('src');

Answer 2

如果要选择所有图像，则必须选择所有图像，例如使用document.getElementsByTagName('img')

选择的结果是HTMLCollection，您可以将其转换为数组。然后，您遍历所有图像并将右键单击事件（contextmenu）添加到所有图像。

如果右键单击图像，则getURL函数将为您提供路径（this.src）

const allImgs = document.getElementsByTagName('img');

function getURL(e) {
  e.preventDefault();
  console.log(this.src);
}

Array.from(allImgs).forEach(img => {
  img.addEventListener('contextmenu', getURL);
})

right click on images
<br>
<img src="https://www.gravatar.com/avatar/0adefd53a9e8790b181785c11f458615?s=48&amp;d=identicon&amp;r=PG&amp;f=1">
<br>
<img src="https://i.stack.imgur.com/rj5lM.png?s=32&amp;g=1">

如何获取网页上图像的URL？

2 个答案: