☰

如何获取页面上所有图片的 URL，并进行编辑和下载

tag-icon • tag-icon google-chrome google-chrome-extensions download-manager
如何获取页面上所有图片的 URL，并进行编辑和下载

这里有一个任务：

一个页面有 300 张 JPEG 图像，其 URL 如下 http://example.com/gallery/500px-500px/7496.jpg

我想编辑这些网址 http://example.com/gallery/1000px-1000px/7496.jpg

并以更好的质量下载。

我现在如何完成任务：我打开一个网页，用任何下载管理器将所有图片下载到一个文件夹中。然后我用cd c:\download + dir *.* > list.txt命令创建一个图片名称列表，并添加带有文件名的 URL http://example.com/gallery/1000px-1000px/。之后，我使用任何文件管理器下载新的 URL。

如何让下载过程更轻松、更快捷？谢谢！

答案1

最简单的方法是用你熟悉的语言编写脚本。

一种可能性是使用 Javascript 编写一个书签来实现这一点。它使用 DOM 重写 URL，然后您下载重写 URL 后的完整网页。

您可以尝试这样的方法：

javascript:(function() {
  var i, imgs;
  imgs = $$('img');
  for (i=0; i < imgs.length; i++){
    imgs[i].src = imgs[i].src.replace('500px-500px', '1000px-1000px');
  }
})();

另一种可能性是在您的计算机中使用服务器语言（例如 Python）来获取网页然后获取图像，但这需要安装解释器或类似的东西。

您应该在书签栏中定义如下链接：[大图像！][1]

[1]: javascript:(function(){var i, imgs; imgs = $$('img'); for (i=0; i < imgs.length; i++){ imgs[i].src = imgs[i].src.replace('500px-500px', '1000px-1000px');}})();

答案2

我编写了一个 Google Chrome 扩展程序，可以从您粘贴的列表或窗口中打开的选项卡的 URL 下载文件。

它被称为保存标签，可在此处获取且开源（请参阅网上商店说明）。

Zeel 的回答似乎非常好。如果你在网上快速搜索一下，就会发现很多关于如何从网页获取链接的其他教程。Chrome 扩展程序的安全设置使得与页面的通信变得很尴尬，但是一旦你有了这个 URL 列表，这个扩展程序就可以处理下载。

答案3

当 Trylks 走在正确的道路上时，我会添加自己的方法……

只需将此脚本粘贴到控制台即可运行。按 F12 打开开发工具，然后单击底部的第二个按钮（带有三行的 >）打开控制台。

顶部的变量可以根据情况进行改变。...

//  User Variables  //

var IMG = true;         //True if the images are on the page as <img> elements, set to false if there are only anchor <a> links.
var TYPE = 'jpg';       //Only important when img is false, Set to the file extension of the files.

var NEWFOLDER = 'http://example.com/gallery/1000px-1000px'  //This is the folder you expect to find the new images in. It should *not* end in a '/'.

//  Begin Script    //

function getURLs() {    //Returns an array of URLs from either <img> or <a> elements for the images.
    var URLs = [];
    if (IMG) {  //If we are dealing with <img> elements. . .
        var imgs = document.getElementsByTagName('img');    //Grab the <img>'s
        for (var i in imgs) {   //Loop through them
            URLs.push(imgs[i].src); //Put the src into an array
        }
    }
    else {  //Or else we are using <a> elements.
        var reg = new RegExp('.*\.' + TYPE + '$');  //Create a regular expression to make sure this is an image (of the type defined)
        var imgs = document.getElementsByTagName('a');  //Grab the <a>'s

        for (var i in imgs) {   //Loop through them
            if (reg.test(imgs[i].href)) {   //Test that this is an image 
                URLs.push(imgs[i].href);    //Put the href in the array
            }
        }
    }

    return URLs;
}

function parseNames(urls) { //Returns an array of names
    var reg = new RegExp('^http.*\/(.*\..*)$');
    var names = [];

    for (var i in urls) {   //Loop through the urls
        if (urls[i]) {  //In case of undefined members
            names.push(reg.exec(urls[i])[1]);
        }
    }

    return names;
}

function makeLinks(files) { //Replaces the page with a list of links
    var body = document.getElementsByTagName('body')[0];    //Get the <body>
    body.innerHTML = '';    //Delete all the page content

    for (var i in files) {  //Loop through the files
        var path = NEWFOLDER + '/' + files[i];

        var link = document.createElement('a'); //Create <a>'s
        link.href = path;
        link.innerHTML = path;

        body.appendChild(link); //Append the links to the document
        body.appendChild(document.createElement('br'));
    }
}


makeLinks(parseNames(getURLs()));

这会将您的页面替换为所需文件的 URL 列表。只需将这些链接粘贴到您的下载管理器中即可。

不幸的是，如果没有服务器端的帮助，就没有办法让 JS 开始下载，所以最好的办法就是给你一个列表。

相关内容