0

同様の画像タグを持つフラットな HTML ファイルのライブラリがあります。それらすべてを調べて、特定の画像タグのページで特定の x、y 座標を見つけるにはどうすればよいですか?

各ページを画像としてレンダリングする(探している画像タグを特定の色に置き換えて一致させる)か、ヘッドレスでページを次のようにレンダリングする必要があると考えていますphantom.js を開き、その方法で座標を見つけます (それが機能するかどうかはわかりませんが)。どちらが簡単になるかについて何か考えはありますか?

LAMP スタックまたは Node.js のいずれかを使用したいと思います。

ありがとう!

4

1 に答える 1

2

PhantomJSを使用するのが最も簡単だと思います。node.jsは必要ありません。

組み合わせexamples/scandir.jsて、examples/phantomwebintro.js欲しいものを手に入れることができます。

var system = require('system');
var fs = require('fs');

if (system.args.length !== 2) {
    console.log("Usage: phantomjs scandir.js DIRECTORY_TO_SCAN");
    phantom.exit(1);
}

function scanDirectory(path, cb) {
    if (fs.exists(path) && fs.isFile(path)) {
        cb(path);
    } else if (fs.isDirectory(path)) {
        fs.list(path).forEach(function (e) {
            if (e !== "." && e !== "..") {
                scanDirectory(path + '/' + e, cb);
            }
        });
    }
}

function parsePage(path) {
    var page = require('webpage').create();
    page.open(path, function(status) {
        if (status === "success") {
           page.includeJs("http://code.jquery.com/jquery-latest.js", function() {
               var images = page.evaluate(function() {
                    var images = [];
                    $('img').each(function() {
                        images.push({ src: $(this).attr('src'), pos: $(this).position() });
                    });
                    return images;
               });
               console.log(images);
           });
         }
    });
}

scanDirectory(system.args[1], parsePage);

このスクリプト(phantomjs img.js kittens)は、ディレクトリ内のファイルをスキャンし、そのディレクトリ内のすべてのファイルをロードし(サブディレクトリ、この動作はで変更できます) 、そのページ上scanDirectoryのすべてのタグを検索し、それらの属性とを含む配列を返します。<img>src.position()

これが機能するまでに約20分かかったので、これが最も簡単な方法だと思います。

于 2013-03-06T21:50:29.123 に答える