捕獲和轉換Web的工具

編寫HTML進行轉換的提示

GrabzIt的API可讓您轉換任何HTML into PDF,DOCX,圖像等。 為此,您需要將常規HTML傳遞給我們的API。 例如,以下示例中顯示的類似HTML的內容。

<html>
<body>
<h1>Hello World</h1>
</body>
</html>

請注意,此HTML示例已包含HTML和BODY標記,但是如果您只想轉換HTML片段,則不需要這樣做。 但是,如果您不添加HTML和BODY標記,則會像在普通瀏覽器中一樣為您自動添加這些標記。 為了解決這個問題,您可以指定一些CSS來刪除BODY標籤上的所有多餘填充和邊距,如下所示。

<style>
body{margin:0;padding:0}
</style>

如果要在HTML中包含JavaScript,圖像或CSS,則可以進行內聯或引用的莊園中提供這些資源。 例如,以下代碼顯示瞭如何以內聯方式在HTML中創建資源。

<html>
<head>
<script>
document.getElementsByTagName('H1')[0].innerText = 'Goodbye';
</script>
<style>
h1{
color:red;
}
</style>
</head>
<body>
<img width="16" height="16" alt="star" src="data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOV
SKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGA
iqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7" />
<h1>Hello World</h1>
</body>
</html>

如您在上面的示例中所見,JavaScript和CSS直接包含在HTML頁面中,以及圖像的轉換方式 int或 資料網址.

如果我們想引用這些資源,那麼我們將需要確保所有鏈接到這些文件的URL都使用絕對URL,這些URL也可以公開訪問。 這意味著URL包含查找資源所需的所有信息。 不使用絕對URL是主要原因 圖像,CSS和JavaScript尚未呈現 轉換HTML時。

為此,需要放置JavaScript,CSS和圖像 into單獨的文件,然後在HTML中引用,看起來像下面的示例。

<html>
<head>
<script src="http://www.example.com/myscript.js"></script>
<link rel="stylesheet" type="text/css" href="http://www.example.com/mystyle.css">
</head>
<body>
<h1>Hello World</h1>
<img width="16" height="16" alt="star" src="http://www.example.com/star.gif" />
</body>
</html>