Question

我实际上是想在js脚本中找到一种从指定URL下载前三个图像的方法。

我已经找到了将img文件下载为新文件名的方法，但是此脚本并未将imgs下载限制为三个： download-data-url-file。

为什么只有一个URL中的三个图像？因为我想稍后设置一个计时器来重复下载任务。

URL是内容供稿（http://feed.500px.com/500px-best）

基本上，如果我们在Firefox上的Inspector工具中输入img源URL，那么就可以看到该源图像，例如：

<img xmlns="http://www.w3.org/1999/xhtml" src="https://drscdn.500px.org/photo/266885357/m%3D900/v2?webp=true&amp;sig=b5a6df5651c4248defdeee0f5b4d1ec599d87d5fa69e7673b5d64cef5a4deeb7" />

因此js脚本将从网站上获取第一张图片，并将.png图片下载为newfilename.png（仅以文件名为例），重复执行第二张和第三张图片的步骤，然后停止运行。

我为自己的任务修改了一个简短的js，我认为可以通过添加var totalImages = 3来限制img的总下载量来改善它。.

var data = canvas.toDataURL("http://feed.500px.com/500px-best/jpeg");
var img = document.createElement('img');
img.src = data;

var a = document.createElement('a');
a.setAttribute("download", "Image1.jpeg");
a.setAttribute("href", data);
a.appendChild(img);

谢谢。

Answer 1

// This code is very specific to 500PX
// I had to use itemcontent selector, as the feed was giving small icons
// as first three images.

var parents = document.getElementsByClassName("itemcontent");
var totalImages = 3;
var done = false;
var result = [];

for(var i = 0; i < parents.length && !done; i++) {
  var images = parents[0].getElementsByTagName("img");

  for(var j = 0; j < images.length && !done; j++) {     
    result.push(images[j].src);
    if(result.length == totalImages)
        done = true;    
  }
}

// The result array contains the first three images of the page.

从后台的URL下载三个第一张图像

1 个答案: