how to screenshot a div using phantomJS

问题

Hi does anyone here can help me to screenshot my div using phantomJS? How can i Screenshot my #dropzone then append it on the same page?

Please help.

回答1:

There are two ways you can partially render a webpage.

1) Make an extra page with just the div, screenshot it using render, and use the result on your actual page.

2) Use the clipRect functionality (as described here):

var clipRect = document.querySelector(selector).getBoundingClientRect();
page.clipRect = {
    top:    clipRect.top,
    left:   clipRect.left,
    width:  clipRect.width,
    height: clipRect.height
};
page.render('capture.png');

回答2:

you can use node-webshot to do so, take a look at options then the captureSelector option.

来源：https://stackoverflow.com/questions/40365521/how-to-screenshot-a-div-using-phantomjs