網頁上框架的屏幕截圖

Question

我只是想知道如何截取我的網頁的屏幕截圖。 可以說我有一個無所不在的界面，中間是顯示網站的框架。 如何拍攝該幀的屏幕截圖。 我不需要該捕捉中包含的任何邊界和界面。 只有框架，如何實現？

我已經包含了代表網站布局的圖片，因此無需包括整個布局，而僅包括框架中的這一部分。 如何以編程方式在圖像中捕獲該幀？ 哪些工具和編程語言可以為我做到這一點？

Answer 1

PhantomJS是一款完全可編程的無頭瀏覽器。 它能夠從打開的網頁中生成PNG，JPEG，GIF和PDF文件。

使用document.querySelector() ，然后使用element.getBoundingClientRect() DOM API來獲取包含要柵格化的元素的矩形，然后webpage.clipRect設置webpage.clipRect屬性並調用webpage.render()方法以生成圖像。 有關示例，請參見此答案 。

Answer 2

我不知道您是否真的對想要使用的技術沒有限制，但是phantomJS（無頭瀏覽器）肯定可以在這里使用。 示例： 如何使用PhantomJS渲染頁面的一部分