C#でHTML画像を管理する

.NET向けHTML画像管理API

Aspose.HTML for .NET は、HTML文書から参照される画像を扱うためのDOM APIとリソースAPIを提供します。C#アプリケーションで HTMLImageElement を作成または更新し、CSSセレクターで画像要素を検索してDOMから削除できます。参照リソースの解決や、変更したHTMLの保存にも対応します。

HTML画像の操作を選択する

• HTMLに画像を追加 。 <img>要素を作成し、ソース、代替テキスト、寸法、必要に応じてモダンな属性を設定して、DOM内の目的の位置に挿入します。
• HTMLから画像を抽出 。 画像参照を検索し、文書のベースアドレスを基準に相対URLを解決して、対応するローカル、リモート、または埋め込みリソースを保存します。
• HTMLから画像を削除 。 選択した<img>要素をDOMから削除します。マークアップの削除と、実体の画像ファイルやCSS背景画像の削除は区別して処理します。
• HTML内の画像サイズを変更 。 参照先の画像ファイルを再サンプリングせずに、表示画像の固有寸法とレスポンシブCSSを設定します。

C#で既存のHTML画像を更新する

この例では、HTMLファイルを読み込み、IDで既存の画像を選択します。参照リソースと代替テキストを変更し、固有寸法を設定して、更新した文書を保存します。画像ファイルはSrcに指定したパスで参照できる必要があります。

using Aspose.Html;

// Load the source HTML file
using HTMLDocument document = new HTMLDocument("input.html");

// Select and update the existing image element
HTMLImageElement image =  document.QuerySelector("#product-image") as HTMLImageElement;

if (image != null)
{
    image.Src = "images/updated-product.webp";
    image.Alt = "Updated product shown from the front";
    image.SetAttribute("width", "960");
    image.SetAttribute("height", "640");
}

// Save the modified HTML document
document.Save("output.html");

HTML画像を管理する基本手順

1. HTMLDocument コンストラクターでソースファイル、URL、文字列、またはストリームを読み込みます。相対リソースを解決する場合は、正しいベースアドレスを指定します。
2. QuerySelector() で1つの画像を検索するか、 QuerySelectorAll() で複数の一致を取得します。
3. 必要な処理に応じて、選択した画像要素を作成、更新、削除、または調査します。
4. ファイルのコピー、ダウンロード、埋め込み、最適化、削除が必要な場合は、参照先の画像リソースを別途処理します。
5. Save() を呼び出してマークアップの変更を保存します。HTMLをPDFや画像形式にレンダリングする場合は、変換処理に進みます。

HTML画像の要素、ソース、リソース

• 画像属性。 src、alt、width、height、loading、decoding、srcset、sizesなど、対象マークアップがサポートする属性を読み取りまたは更新します。
• DOM内の配置。 文書本体または選択したコンテナーに画像を追加し、別の親要素への移動、置換、文書ツリーからの削除を行います。
• リソースの場所。 文書のベースアドレスを考慮しながら、相対パス、絶対HTTPまたはHTTPS URL、ファイルURL、埋め込みデータURIを処理します。
• 要素の選択。 ID、クラス、属性セレクター、構造セレクター、XPath、DOM走査を使用して、1つの画像または画像コレクションを対象にします。
• 表示寸法。 固有のwidthとheightをCSSと組み合わせ、固定またはレスポンシブなレイアウトを構成します。
• img以外の画像。 CSS背景画像、SVGコンテンツ、<picture>ソース、ファビコン、画像入力は異なる要素やスタイル規則を使用するため、個別の選択ロジックが必要です。
• 出力API。 レンダリングしたページ全体をPNG、JPEG、TIFF、または別の対応形式で保存する場合は、準備した文書を変換処理に渡します。

HTML画像のドキュメントとAPIリファレンス

<img>要素、埋め込みデータ、CSS背景画像の例については、 How to Add Image to HTML を参照してください。 Working with HTML Documents では、文書の読み込み、編集、保存、リソース処理について説明しています。画像のプロパティと継承されたDOMメソッドは、 HTMLImageElement リファレンスで確認できます。

Aspose.HTML for .NET のインストール

.NET CLI を使用して、NuGet から Aspose.HTML for .NET をインストールします。

dotnet add package Aspose.HTML

NuGet パッケージ マネージャーの UI を使用するか、パッケージ マネージャー コンソールで Install-Package Aspose.HTML を実行することもできます。セットアップの詳細は インストール ガイド を参照してください。評価制限なしで API を試すには、 一時ライセンス を申請できます。

HTML画像管理に関するFAQ

1. Aspose.HTMLでPNGやJPEGファイルのピクセルを編集できますか？

いいえ。画像管理の処理では、HTML要素、属性、スタイル、参照リソースを更新します。再サンプリング、切り抜き、圧縮、ピクセル単位の編集には、別の画像処理が必要です。

2. HTMLの処理時に画像の相対パスはどのように解決されますか？

相対的なsrc値は、通常は読み込んだファイルまたはURLの場所から決まる文書のベースアドレスを基準に解決されます。文字列またはストリームからHTMLを作成する場合は、相対リソースを正しく解決できるようにベースURLを指定します。

3. HTMLから画像を抽出することとHTMLを画像に変換することは同じですか？

いいえ。抽出では、<img>要素で使用されるJPEGなど、要素やスタイルから参照されるリソースを保存します。 HTMLから画像への変換 では、ページレイアウト全体を新しいラスター画像としてレンダリングします。