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

Question

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

Answer 1

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

在IE（我认为7或以上）中使用F12打开一个类似的窗口。

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

要自动执行此过程，请尝试使用http://www.phantomjs.org/（，如此处所示：wget + JavaScript? ）

修改

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

在推送Ctrl + Shift + I后按Ctrl + S，在FireFox中，它将保存当前的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文件更改为。