从使用 javascript 的页面获取元素信息

Question

在谷歌浏览器等浏览器中，当我想获取页面信息时，我只是选择查看页面源，但在某些使用 javascript 的网站中你不能这样做，所以我发现在任何元素上，如按钮并选择检查元素，它将向我显示我需要的信息，它真的很棒，但我想自动执行此操作 例如对于使用 html 的简单页面，我只是使用 wget 将页面保存为文本以供以后分析，但对于使用 javascript 和 css 的页面，这是不可能的， 所以我的问题是有一种工具或任何方式来获取我需要的信息并将其保存为文本 假设我指定了站点和元素（按钮），它将下载代码并将其保存为文本

Answer 1

如果您使用 chrome，您可以通过 Ctrl + Shift + J 来打开开发者工具窗口。单击最左上角的图标（元素）以查看 JavaScript 修改后的 DOM。

在 IE（我认为是 7 或更高版本）中使用 F12 打开类似的窗口。

在 FireFox 中，您可以使用 Ctrl + Shift +I 打开类似的窗口。

为了自动化这个过程，请尝试使用http://www.phantomjs.org/（这里建议：wget + JavaScript?）

编辑：

IE中有一个保存按钮，用于保存当前的DOM：

在你推送Ctrl + Shift + I后在FireFox中按下Ctrl + S，它将保存当前的DOM。

编辑 2：

下载 PhantomJS，创建一个名为 script.js 的文件，将其粘贴到其中：

system = require('system');
var page = new WebPage();
page.open(system.args[1], function (status) {
    if(status == 'success') {
        html = page.evaluate(function() {
            return document.getElementsByTagName('html')[0].innerHTML;
        }); 
        console.log(html);
    } else {
        console.log('Page could not be loaded');
    }
    phantom.exit();
});

在注释行运行phantomjs script.js http://www.website.co.uk > website.html（script.js 和 phantom.exe 必须在当前工作目录中）。将http://www.website.co.uk更改为您需要下载的网站，将website.html更改为您要保存到的`html文件。