捕獲和轉換Web的工具
捕獲HTML元素

使用GrabzIt捕獲HTML元素

GrabzIt的API 及 截圖工具 使捕獲網頁或HTML代碼段中包含的HTML元素成為可能。 然後可以將其作為圖像，PDF或Word文檔返回。

唯一的要求是要捕獲的HTML元素必須具有 獨特的CSS選擇器 例如類，id或更複雜的CSS選擇器來識別它。

在以下示例中，我們將在下面的DIV中捕獲內容。 

...
<div id="Article">
<p>This is the content I am interested in.</p>
<img src="myimage.jpg">
</div>
...

將HTML元素捕獲為圖像

將圖像的寬度和高度設置為-1，以使圖像與目標HTML元素的大小匹配。 通過將瀏覽器高度設置為-1，瀏覽器窗口的長度也會自動增加，以確保目標HTML元素是否適合 into瀏覽器。

下面的示例代碼顯示了使用ASP.NET從網頁捕獲HTML元素作為圖像是多麼容易。 剛開始創建圖像 下載ASP.NET庫， 拿你的 關鍵和秘密 進而 使用演示 包含在其中。 然後檢查 ASP.NET的API文檔 找出使用GrabzIt API的所有方法。

GrabzItClient grabzIt = new GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret");

ImageOptions options = new ImageOptions();
options.OutputWidth = -1;
options.OutputHeight = -1;
options.BrowserHeight = -1;
options.Format = ImageFormat.jpg;
options.TargetElement = "#Article";

grabzIt.URLToImage("http://www.example.com/", options);
grabzIt.SaveTo("images/result.jpg");

下面的示例代碼顯示了使用Java從網頁捕獲HTML元素作為圖像是多麼容易。 剛開始創建圖像 下載Java庫， 拿你的 關鍵和秘密 進而 使用演示 包含在其中。 然後檢查 Java API文檔 找出使用GrabzIt API的所有方法。

GrabzItClient grabzIt = new GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret");

ImageOptions options = new ImageOptions();
options.setWidth(-1);
options.setHeight(-1);
options.setBrowserHeight(-1);
options.setFormat(ImageFormat.JPG);
options.setTargetElement("#Article");

grabzIt.URLToImage("http://www.example.com/", options);
grabzIt.SaveTo("images/result.jpg");

下面的示例代碼顯示了使用JavaScript從網頁捕獲HTML元素作為圖像是多麼容易。 開始創建圖像下載 GrabzIt的JavaScript庫。 然後得到你的 關鍵和秘密, 添加域 您要使用JavaScript，然後簽出 JavaScript的API文檔 找出使用GrabzIt API的所有方法。

使用JavaScript API時，也可以 捕獲HTML元素的動態內容.

<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@<%= APIVersion.JavaScript %>/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertURL("http://www.example.com/",
{"target": "#Article", "bheight": -1, "height": -1, "width": -1}).Create();
</script>

下面的示例代碼顯示了使用Node.js從網頁捕獲HTML元素作為圖像是多麼容易。 剛開始創建圖像 下載Node.js程序包， 拿你的 關鍵和秘密 進而 使用演示 包含在其中。 然後檢查 Node.js的API文檔 找出使用GrabzIt API的所有方法。

var grabzit = require('grabzit');

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");
// The minus ones indicates that image should not be cropped
var options = {"browserHeight":-1, "width":-1, "height":-1, "format":"jpg", "target":"#Article"};

client.url_to_image("http://www.example.com/", options);
client.save_to("images/result.jpg", function (error, id){
    if (error != null){
        throw error;
    }
});

下面的示例代碼顯示了使用Perl從網頁捕獲HTML元素作為圖像是多麼容易。 剛開始創建圖像 下載Perl庫， 拿你的 關鍵和秘密 進而 使用演示 包含在其中。 然後檢查 Perl的API文檔 找出使用GrabzIt API的所有方法。

#!/usr/bin/perl

use GrabzItClient;

$grabzIt = GrabzItClient->new("Sign in to view your Application Key", "Sign in to view your Application Secret");

$options = GrabzItImageOptions->new();
$options->browserHeight(-1);
$options->width(-1);
$options->height(-1);
$options->targetElement("#Article");

$grabzIt->URLToImage("http://www.example.com/", $options);
$grabzIt->SaveTo("images/result.jpg");

下面的示例代碼顯示了使用PHP從網頁捕獲HTML元素作為圖像是多麼容易。 剛開始創建圖像文件 下載PHP庫， 拿你的 關鍵和秘密 進而 使用演示 包含在其中。 然後檢查 PHP的API文檔 找出使用GrabzIt API的所有方法。

include("GrabzItClient.php");

$grabzIt = new \GrabzIt\GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret");

// The -1 indicates that image should not be cropped
$options = new \GrabzIt\GrabzItImageOptions();
$options->setWidth(-1);
$options->setHeight(-1);
$options->setBrowserHeight(-1);
$options->setFormat("jpg");
$options->setTargetElement("#Article");

$grabzIt->URLToImage("http://www.example.com/", $options);
$grabzIt->SaveTo("images/result.jpg");

下面的示例代碼顯示了使用Python從網頁捕獲HTML元素作為圖像是多麼容易。 剛開始創建圖像 下載Python庫， 拿你的 關鍵和秘密 進而 使用演示 包含在其中。 然後檢查 Python的API文檔 找出使用GrabzIt API的所有方法。

from GrabzIt import GrabzItClient

grabzIt = GrabzItClient.GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret")

# The -1 indicates that image should not be cropped
options = GrabzItImageOptions.GrabzItImageOptions()
options.width = 250
options.height = 250
options.browserHeight = -1
options.format = "jpg"
options.targetElement = "#Article"

grabzIt.URLToImage("http://www.example.com/", options)
grabzIt.SaveTo("images/result.jpg")

下面的示例代碼顯示了使用我們的REST API從網頁捕獲HTML元素作為圖像的便捷性。 然後檢查 REST API的API文檔 找出可以自定義捕獲內容的所有方法。

https://api.grabz.it/services/convert?key=Sign in to view your Application Key&width=-1&height=-1&bheight=-1&target=%23Article&format=jpg&url=https%3A%2F%2Fwww.example.com%2F

下面的示例代碼顯示了使用Ruby將HTML轉換為JPG格式有多麼容易。 剛開始創建圖像 下載Ruby Gem， 拿你的 關鍵和秘密 進而 使用演示 包含在其中。 然後檢查 Ruby的API文檔 找出使用GrabzIt API的所有方法。

require 'grabzit'

grabzItClient = GrabzIt::Client.new("Sign in to view your Application Key", "Sign in to view your Application Secret")

options = GrabzIt::ImageOptions.new()
options.browserHeight = -1
options.width = -1
options.height = -1
options.targetElement = "#Article"

grabzItClient.url_to_image("http://www.example.com/", options)
grabzItClient.save_to("images/result.jpg")

將HTML元素捕獲為DOCX

轉換捕獲的HTML元素時 int在Word文檔中，捕獲的HTML元素將顯示在Word文檔頁面的左上方。

下面的示例代碼顯示了使用ASP.NET從網頁開始將HTML元素捕獲為Word文檔是多麼容易。 儘管GrabzIt的ASP.NET庫與任何.NET語言都兼容。 要開始創建PDF文件 下載ASP.NET庫， 拿你的 關鍵和秘密 進而 使用演示 包含在其中。 然後檢查 ASP.NET的API文檔 找出使用GrabzIt API的所有方法。

GrabzItClient grabzIt = new GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret");

DOCXOptions options = new DOCXOptions();
options.TargetElement = "#Article";

grabzIt.URLToDOCX("http://www.example.com/", options);
grabzIt.SaveTo("documents/result.docx");

下面的示例代碼顯示了使用Java從網頁捕獲HTML元素作為Word文檔是多麼容易。 要開始創建DOCX 下載Java庫， 拿你的 關鍵和秘密 進而 使用演示 包含在其中。 然後檢查 Java API文檔 找出使用GrabzIt API的所有方法。

GrabzItClient grabzIt = new GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret");

DOCXOptions options = new DOCXOptions();
options.setTargetElement("#Article");

grabzIt.URLToDOCX("http://www.example.com/", options);
grabzIt.SaveTo("documents/result.docx");

下面的示例代碼顯示了使用JavaScript從網頁捕獲HTML元素作為Word文檔是多麼容易。 開始創建DOCX的下載 GrabzIt的JavaScript庫。 然後得到你的 關鍵和秘密, 添加域 您要使用JavaScript，然後簽出 JavaScript的API文檔 找出使用GrabzIt API的所有方法。

使用JavaScript API時，也可以 捕獲HTML元素的動態內容.

<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@<%= APIVersion.JavaScript %>/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertURL("http://www.example.com/",
{"format": "docx", "target": "#Article"}).Create();
</script>

下面的示例代碼顯示了使用Node.js從網頁開始將HTML元素捕獲為Word文檔是多麼容易。 要開始創建DOCX 下載Node.js程序包， 拿你的 關鍵和秘密 進而 使用演示 包含在其中。 然後檢查 Node.js的API文檔 找出使用GrabzIt API的所有方法。

var grabzit = require('grabzit');

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");
client.url_to_docx("http://www.example.com/", {"targetElement": "#Article"});
client.save_to("documents/result.docx", function (error, id){
    if (error != null){
        throw error;
    }
});

下面的示例代碼顯示了使用Perl從網頁中捕獲HTML元素作為Word文檔非常容易。 要開始創建DOCX 下載Perl庫， 拿你的 關鍵和秘密 進而 使用演示 包含在其中。 然後檢查 Perl的API文檔 找出使用GrabzIt API的所有方法。

#!/usr/bin/perl

use GrabzItClient;

$grabzIt = GrabzItClient->new("Sign in to view your Application Key", "Sign in to view your Application Secret");

$options = GrabzItDOCXOptions->new();
$options->targetElement("#Article");

$grabzIt->URLToDOCX("http://www.example.com/", $options);
$grabzIt->SaveTo("documents/result.docx");

下面的示例代碼顯示了使用PHP從網頁捕獲HTML元素作為Word文檔是多麼容易。 要開始創建DOCX 下載PHP庫， 拿你的 關鍵和秘密 進而 使用演示 包含在其中。 然後檢查 PHP的API文檔 找出使用GrabzIt API的所有方法。

include("GrabzItClient.php");

$grabzIt = new \GrabzIt\GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret");

$options = new \GrabzIt\GrabzItDOCXOptions();
$options->setTargetElement("#Article");

$grabzIt->URLToDOCX("http://www.example.com/", $options);
$grabzIt->SaveTo("documents/result.docx");

下面的示例代碼顯示了使用Python從網頁捕獲HTML元素作為Word文檔是多麼容易。 要開始創建DOCX 下載Python庫， 拿你的 關鍵和秘密 進而 使用演示 包含在其中。 然後檢查 Python的API文檔 找出使用GrabzIt API的所有方法。

from GrabzIt import GrabzItClient

grabzIt = GrabzItClient.GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret")

options = GrabzItDOCXOptions.GrabzItDOCXOptions()
options.targetElement = "#Article"

grabzIt.URLToDOCX("http://www.example.com/", options)
grabzIt.SaveTo("documents/result.docx")

下面的示例代碼顯示了使用我們的REST API從網頁捕獲HTML元素作為Word文檔是多麼容易。 然後檢查 REST API的API文檔 找出可以自定義捕獲內容的所有方法。

https://api.grabz.it/services/convert?key=Sign in to view your Application Key&target=%23Article&format=docx&url=https%3A%2F%2Fwww.example.com%2F

下面的示例代碼顯示了使用Ruby從網頁中捕獲HTML元素作為Word文檔是多麼容易。 要開始創建DOCX 下載Ruby Gem， 拿你的 關鍵和秘密 進而 使用演示 包含在其中。 然後檢查 Ruby的API文檔 找出使用GrabzIt API的所有方法。

require 'grabzit'

grabzItClient = GrabzIt::Client.new("Sign in to view your Application Key", "Sign in to view your Application Secret")

options = GrabzIt::DOCXOptions.new()
options.targetElement = "#Article"

grabzItClient.url_to_docx("http://www.example.com/", options)

grabzItClient.save_to("documents/result.docx")

將HTML元素捕獲為PDF

默認情況下，轉換捕獲的HTML元素時 int在PDF文檔中，捕獲的HTML元素將以與DOCX相同的方式出現在PDF頁面的左上角。 但是在PDF中，也可以自動 設置頁面大小，使其與HTML元素的大小匹配.

下面的示例代碼顯示了使用ASP.NET從網頁捕獲HTML元素為PDF的過程非常容易。 儘管GrabzIt的ASP.NET庫與任何.NET語言都兼容。 要開始創建PDF文件 下載ASP.NET庫， 拿你的 關鍵和秘密 進而 使用演示 包含在其中。 然後檢查 ASP.NET的API文檔 找出使用GrabzIt API的所有方法。

GrabzItClient grabzIt = new GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret");

PDFOptions options = new PDFOptions();
options.TargetElement = "#Article";

grabzIt.URLToPDF("http://www.example.com/", options);
grabzIt.SaveTo("documents/result.pdf");

下面的示例代碼顯示了使用Java從網頁捕獲HTML元素為PDF的過程非常容易。 要開始創建PDF文件 下載Java庫， 拿你的 關鍵和秘密 進而 使用演示 包含在其中。 然後檢查 Java API文檔 找出使用GrabzIt API的所有方法。

GrabzItClient grabzIt = new GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret");

PDFOptions options = new PDFOptions();
options.setTargetElement("#Article");

grabzIt.URLToPDF("http://www.example.com/", options);
grabzIt.SaveTo("documents/result.pdf");

下面的示例代碼顯示了使用JavaScript從網頁捕獲HTML元素為PDF的過程非常容易。 開始創建PDF的下載 GrabzIt的JavaScript庫。 然後得到你的 關鍵和秘密, 添加域 您要使用JavaScript，然後簽出 JavaScript的API文檔 找出使用GrabzIt API的所有方法。

使用JavaScript API時，也可以 捕獲HTML元素的動態內容.

<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@<%= APIVersion.JavaScript %>/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertURL("http://www.example.com/",
{"format": "pdf", "target": "#Article"}).Create();
</script>

下面的示例代碼顯示了使用Node.js從網頁捕獲HTML元素為PDF的過程非常容易。 要開始創建PDF文件 下載Node.js程序包， 拿你的 關鍵和秘密 進而 使用演示 包含在其中。 然後檢查 Node.js的API文檔 找出使用GrabzIt API的所有方法。

var grabzit = require('grabzit');

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");
grabzIt.url_to_pdf("http://www.example.com/", {"targetElement":"#Article"});
client.save_to("documents/result.pdf", function (error, id){
    if (error != null){
        throw error;
    }
});

下面的示例代碼顯示了使用Perl從網頁捕獲HTML元素為PDF的過程非常容易。 要開始創建PDF文件 下載Perl庫， 拿你的 關鍵和秘密 進而 使用演示 包含在其中。 然後檢查 Perl的API文檔 找出使用GrabzIt API的所有方法。

#!/usr/bin/perl

use GrabzItClient;

$grabzIt = GrabzItClient->new("Sign in to view your Application Key", "Sign in to view your Application Secret");

$options = GrabzItPDFOptions->new();
$options->targetElement("#Article");

$grabzIt->URLToPDF("http://www.example.com/", $options);
$grabzIt->SaveTo("documents/result.pdf");

下面的示例代碼顯示了使用PHP從網頁捕獲HTML元素為PDF的過程非常容易。 要開始創建PDF文件 下載PHP庫， 拿你的 關鍵和秘密 進而 使用演示 包含在其中。 然後檢查 PHP的API文檔 找出使用GrabzIt API的所有方法。

include("GrabzItClient.php");

$grabzIt = new \GrabzIt\GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret");

$options = new \GrabzIt\GrabzItPDFOptions();
$options->setTargetElement("#Article");

$grabzIt->URLToPDF("http://www.example.com/", $options);
$grabzIt->SaveTo("documents/result.pdf");

下面的示例代碼顯示了使用Python從網頁捕獲HTML元素為PDF的過程非常容易。 要開始創建PDF文件 下載Python庫， 拿你的 關鍵和秘密 進而 使用演示 包含在其中。 然後檢查 Python的API文檔 找出使用GrabzIt API的所有方法。

from GrabzIt import GrabzItClient

grabzIt = GrabzItClient.GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret")

options = GrabzItPDFOptions.GrabzItPDFOptions()
options.targetElement = "#Article"

grabzIt.URLToPDF("http://www.example.com/", options)
grabzIt.SaveTo("documents/result.pdf")

以下示例代碼顯示了使用我們的REST API從網頁捕獲HTML元素為PDF的過程非常容易。 然後檢查 REST API的API文檔 找出可以自定義捕獲內容的所有方法。

https://api.grabz.it/services/convert?key=Sign in to view your Application Key&target=%23Article&format=pdf&url=https%3A%2F%2Fwww.example.com%2F

下面的示例代碼顯示了使用Ruby從網頁開始將HTML元素捕獲為PDF的過程是多麼容易。 要開始創建PDF文件 下載Ruby Gem， 拿你的 關鍵和秘密 進而 使用演示 包含在其中。 然後檢查 Ruby的API文檔 找出使用GrabzIt API的所有方法。

require 'grabzit'

grabzItClient = GrabzIt::Client.new("Sign in to view your Application Key", "Sign in to view your Application Secret")

options = GrabzIt::PDFOptions.new()
options.targetElement = "#Article"

grabzItClient.url_to_pdf("http://www.example.com/", options)

grabzItClient.save_to("documents/result.pdf")

在截圖工具中捕獲HTML元素

我們還提供捕獲HTML元素的功能 在線截圖工具 在創建計劃任務時，只需確保設置了 目標元素 字段，其中包含您要捕獲的HTML元素的CSS選擇器。 如果您希望控制PDF文檔的裁剪，則還需要設置 自定義頁面大小 領域。

條款和條件
隱私權政策
服務水平協議
©GrabzIt® 2023
English簡體中文法國德語印度語俄語西班牙語