用casperjs截取任意网页区域

随着网络技术的发达，我们越来越多的用到截图功能。windows上面有非常人性化的QQ截图。浏览器里也有方便的截图插件。今天宝哥来教你怎么用代码截取网页存为图片。这对于一些出于各种目的写自动化脚本的，还有一些Linux用户来说，还是很需求的。而且，即使是windows用户，对一个网页需要滚屏才能显示完的内容来说，要用截图工具来边滚边截还是很（Mei）有（You）难（Ke）度（Neng）的。

phantomjs有个api，就是专门做截图的。但它只能截取网页和指定区域截图，而有个非常常见的需求就是，我想截网页中的一块正文区域或者某块特定的区域，但我又不想去算它的坐标和长宽，怎么办？没关系，casperjs帮我们封闭了。它有casper.captureSelector这个api。我写了个支持命令行参数的casperjs脚本，放在了MagicScripts，叫capture.js。

用法

casperjs /path/to/capture.js page_url filename.png [selector] 。

• 首先，你肯定要安装casperjs。
• 第一个参数是网页的网址
• 第二个截取屏幕后的存储的文件的名
• 第三个参数是选择器，比如'.main'，'.content'，'#data-list'之类的（支持CSS3选择器）。此参数是可选的，如果指定了，就只会截取该选择器命中的区域。否则，就截取整个网页。

感兴趣的可以点前面的链接前往git上查看代码。如果有自定义需求（比如，支持指定坐标区域截图），可以fork代码自由定制。

（转载本站文章请注明出处 开发部落 - sudodev.cn）