如何在Phantomjs（javascript）中获取完整html页面的高度？

Question

如何在Phantomjs（javascript）中获取完整html页面的高度？

3

你好，我尝试了所有这些方法：

document.body.scrollHeight
document.body.offsetHeight
document.documentElement.clientHeight
document.documentElement.scrollHeight
document.documentElement.offsetHeight

这段代码在正常浏览器中可以正常工作，但是在Phantomjs中我得到的是CMD（命令行窗口）的高度。我想获取页面的高度，以便稍后在代码中剪裁截图。页面的高度必须与在正常浏览器上查看时相同。

我得到了300像素，而我想获取完整的html页面高度（这取决于URL）..

- Fábio Linhares

如果没有实际的浏览器，你期望得到什么？为什么命令行窗口高度不能简单地用于测试目的？考虑对您的帖子进行编辑以澄清。 - jamesmortensen

既然Phantom没有实际的物理浏览器，为什么CMD窗口的高度不能作为替代品呢？ - jamesmortensen

CMD 高度是什么意思？你得到了哪些值，期望得到哪些值？请展示一个完整的脚本示例。 - Artjom B.

我已经编辑了我的问题... - Fábio Linhares

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Artjom B. · Accepted Answer

这些值与其他浏览器的期望值相同。完整示例：

var page = require('webpage').create();

var url = 'http://www.stackoverflow.com/';

page.open(url, function(){
    console.log(page.evaluate(function(){
        return JSON.stringify({
            "document.body.scrollHeight": document.body.scrollHeight,
            "document.body.offsetHeight": document.body.offsetHeight,
            "document.documentElement.clientHeight": document.documentElement.clientHeight,
            "document.documentElement.scrollHeight": document.documentElement.scrollHeight
        }, undefined, 4);
    }));
    phantom.exit();
});

输出:

{
    "document.body.scrollHeight": 8777,
    "document.body.offsetHeight": 8777,
    "document.documentElement.clientHeight": 300,
    "document.documentElement.scrollHeight": 8777
}

可能导致你的情况不同的原因:

DOM只能通过page.evaluate()访问。虽然存在page.evaluate()之外的document对象，但它只是一个虚拟对象。
PhantomJS默认视口大小为400x300像素。如果网页是响应式的，则仅使用该大小。
结合上述观点，<body>可能无法滚动，但只有某些子元素包含所有（可滚动）内容。在这种情况下，每个值都等于视口高度。