捕获和转换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文档的裁剪,则还需要设置 自定义页面大小 领域。