Kelola Gambar HTML di C#

API .NET untuk Mengelola Gambar HTML

Aspose.HTML for .NET menyediakan API DOM dan sumber daya untuk menangani gambar yang dirujuk oleh dokumen HTML. Aplikasi C# dapat membuat atau memperbarui HTMLImageElement , menemukan elemen gambar dengan selektor CSS, menghapusnya dari DOM, menyelesaikan referensi sumber daya, dan menyimpan HTML yang telah diubah.

Pilih Alur Kerja Gambar HTML

• Tambahkan Gambar ke HTML . Buat elemen <img>, tetapkan sumber, teks alternatif, dimensi, dan atribut modern opsional, lalu sisipkan pada posisi DOM yang diperlukan.
• Ekstrak Gambar dari HTML . Temukan referensi gambar, selesaikan URL relatif berdasarkan alamat dasar dokumen, dan simpan sumber daya lokal, jarak jauh, atau tersemat yang didukung.
• Hapus Gambar dari HTML . Hapus elemen <img> yang dipilih dari DOM dan bedakan penghapusan markup dari penghapusan file gambar fisik atau sumber daya latar belakang CSS.
• Ubah Ukuran Gambar dalam HTML . Tetapkan dimensi intrinsik dan CSS responsif untuk gambar yang ditampilkan tanpa mengambil sampel ulang file sumber yang dirujuk.

Perbarui Gambar HTML yang Ada di C#

Contoh ini memuat file HTML, memilih gambar yang ada berdasarkan ID, mengubah sumber daya yang dirujuk dan teks alternatifnya, menetapkan dimensi intrinsik, lalu menyimpan dokumen yang diperbarui. File gambar harus tetap tersedia pada jalur yang ditetapkan ke 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");

Langkah Utama untuk Mengelola Gambar HTML

1. Muat file sumber, URL, string, atau stream dengan konstruktor HTMLDocument dan berikan alamat dasar yang benar ketika sumber daya relatif perlu diselesaikan.
2. Temukan satu gambar dengan QuerySelector() atau kumpulkan beberapa kecocokan dengan QuerySelectorAll() .
3. Buat, perbarui, hapus, atau periksa elemen gambar yang dipilih sesuai alur kerja yang diperlukan.
4. Tangani sumber daya gambar yang dirujuk secara terpisah ketika file harus disalin, diunduh, disematkan, dioptimalkan, atau dihapus.
5. Panggil Save() untuk menulis perubahan markup, atau lanjutkan ke alur kerja konversi jika HTML harus dirender menjadi PDF atau format gambar.

Elemen, Sumber, dan Sumber Daya Gambar HTML

• Atribut gambar. Baca atau perbarui src, alt, width, height, loading, decoding, srcset, sizes, dan atribut lain yang didukung oleh markup target.
• Penempatan DOM. Tambahkan gambar ke badan dokumen atau kontainer yang dipilih, pindahkan ke induk lain, ganti, atau hapus dari pohon dokumen.
• Lokasi sumber daya. Gunakan jalur relatif, URL HTTP atau HTTPS absolut, URL file, dan URI data tersemat dengan memperhitungkan alamat dasar dokumen.
• Pemilihan elemen. Gunakan ID, kelas, selektor atribut, selektor struktural, XPath, atau penelusuran DOM untuk menargetkan satu gambar atau kumpulan gambar.
• Dimensi tampilan. Gabungkan nilai intrinsik width dan height dengan CSS untuk tata letak tetap atau responsif.
• Gambar di luar elemen img. Gambar latar CSS, konten SVG, sumber <picture>, favicon, dan input gambar menggunakan elemen atau aturan gaya berbeda sehingga memerlukan logika pemilihan tersendiri.
• API output. Teruskan dokumen yang telah disiapkan ke alur kerja konversi ketika seluruh halaman yang dirender harus disimpan sebagai PNG, JPEG, TIFF, atau format lain yang didukung.

Dokumentasi Gambar HTML dan Referensi API

Baca How to Add Image to HTML untuk contoh elemen <img>, data tersemat, dan gambar latar CSS. Bagian Working with HTML Documents menjelaskan pemuatan, pengeditan, penyimpanan, dan penanganan sumber daya dokumen. Gunakan referensi HTMLImageElement untuk properti gambar dan metode DOM yang diwarisi.

Instal Aspose.HTML for .NET

Instal Aspose.HTML for .NET dari NuGet menggunakan .NET CLI:

dotnet add package Aspose.HTML

Anda juga dapat menggunakan antarmuka NuGet Package Manager atau menjalankan Install-Package Aspose.HTML di Package Manager Console. Lihat panduan instalasi untuk detail penyiapan, atau minta lisensi sementara untuk mengevaluasi API tanpa batasan evaluasi.

FAQ Pengelolaan Gambar HTML

1. Apakah Aspose.HTML mengedit piksel dalam file PNG atau JPEG?

Tidak. Operasi pengelolaan gambar memperbarui elemen HTML, atribut, gaya, dan sumber daya yang dirujuk. Pengambilan sampel ulang, pemotongan, kompresi, dan pengeditan tingkat piksel memerlukan langkah pemrosesan gambar terpisah.

2. Bagaimana jalur gambar relatif diselesaikan saat memproses HTML?

Nilai src relatif diselesaikan berdasarkan alamat dasar dokumen, yang biasanya berasal dari lokasi file atau URL yang dimuat. Jika HTML dibuat dari string atau stream, berikan URL dasar agar aplikasi dapat menyelesaikan jalur sumber daya relatif dengan benar.

3. Apakah mengekstrak gambar dari HTML sama dengan mengonversi HTML menjadi gambar?

Tidak. Ekstraksi menyimpan sumber daya yang dirujuk oleh elemen atau gaya, seperti JPEG yang digunakan oleh elemen <img>. Konversi HTML ke gambar merender seluruh tata letak halaman menjadi output raster baru.