ตัวเลือก CSS ใน HTML C#

คุณสามารถใช้กฎที่แตกต่างกันกับกฎ CSS ได้โดยใช้ตัวเลือก CSS บทความนี้จะอธิบายรายละเอียดพร้อมกับตัวอย่างของวิธีการ QuerySelector และ QuerySelectorAll คุณสามารถใช้ตัวเลือก CSS เหล่านี้เพื่อนำทางเอกสาร HTML หรือสร้างรูปแบบการค้นหาเพื่อให้ตรงกับองค์ประกอบในเอกสาร HTML

ใช้ตัวเลือก CSS ใน HTML - การติดตั้ง C# API

Aspose.HTML for .NET API สามารถใช้เพื่อสร้าง แก้ไข จัดการ หรือแปลงเอกสาร HTML พร้อมกับ [รูปแบบไฟล์] อื่นๆ มากมาย3 คุณสามารถกำหนดค่าได้อย่างง่ายดายโดยการดาวน์โหลดไฟล์ DLL อ้างอิงจากส่วน ดาวน์โหลด หรือเรียกใช้คำสั่งการติดตั้ง NuGet ต่อไปนี้:

PM> Install-Package Aspose.Html

ใช้ตัวเลือก CSS QuerySelector ใน C#

คุณสามารถจัดสไตล์องค์ประกอบที่เลือกหรือนำทางไฟล์ HTML ด้วยวิธี QuerySelector ขั้นตอนต่อไปนี้จะอธิบายวิธีจัดสไตล์องค์ประกอบที่เลือกซึ่งตรงกับตัวเลือก:

  1. สร้างอินสแตนซ์ของคลาส HTMLDocument
  2. สร้างตัวเลือก CSS เพื่อแยกองค์ประกอบย่อหน้าแรก
  3. ตั้งค่าแอตทริบิวต์ style และบันทึกไฟล์ HTML ที่อัปเดต

ข้อมูลโค้ดด้านล่างแสดงวิธีใช้ตัวเลือก CSS QuerySelector เพื่อประมวลผลองค์ประกอบที่เลือกในเอกสาร HTML:

// เตรียมเส้นทางไปยังไฟล์ HTML ต้นฉบับ
string documentPath = "queryselector.html";

// สร้างอินสแตนซ์ของเอกสาร HTML
var document = new Aspose.Html.HTMLDocument(documentPath);

// ที่นี่เราสร้างตัวเลือก CSS ที่แยกองค์ประกอบย่อหน้าแรกในเอกสาร
var element = document.QuerySelector("p");

// พิมพ์เนื้อหาของย่อหน้าแรก  
Console.WriteLine(element.InnerHTML);
// เอาท์พุท: วิธีการ QuerySelector() ส่งคืนองค์ประกอบแรกในเอกสารที่ตรงกับตัวเลือกที่ระบุ

// ตั้งค่าแอตทริบิวต์ลักษณะที่มีคุณสมบัติสำหรับองค์ประกอบที่เลือก               
element.SetAttribute("style", "color:rgb(50,150,200); background-color:#e1f0fe;");

// บันทึกเอกสาร HTML ลงในไฟล์
document.Save("queryselector-p.html");

ทำงานกับ QuerySelectorAll CSS Selector ใน HTML โดยใช้ C#

บางครั้งคุณอาจต้องประมวลผลเหตุการณ์ที่เกิดขึ้นทั้งหมดขององค์ประกอบ โปรดทำตามขั้นตอนด้านล่างเพื่อใช้งานตัวเลือก QuerySelectorAll CSS:

  1. โหลดไฟล์ HTML อินพุตด้วยคลาส HTMLDocument
  2. สร้างตัวเลือก CSS เพื่อแยกองค์ประกอบทั้งหมดของคลาส
  3. วนซ้ำองค์ประกอบต่างๆ และตั้งค่าแอตทริบิวต์สไตล์
  4. บันทึกเอกสาร HTML ที่อัปเดต

ตัวอย่างโค้ดต่อไปนี้สาธิตวิธีการใช้ตัวเลือก CSS QuerySelectorAll โดยทางโปรแกรมใน C#:

// เตรียมเส้นทางเอาต์พุตสำหรับการบันทึกเอกสาร HTML
string savePath = "css-selector-color.html";

// เตรียมเส้นทางไปยังไฟล์ HTML ต้นฉบับ
string documentPath = "spring.html";

// สร้างอินสแตนซ์ของเอกสาร HTML
var document = new Aspose.Html.HTMLDocument(documentPath);

// ที่นี่เราสร้างตัวเลือก CSS ที่แยกองค์ประกอบทั้งหมดที่มีแอตทริบิวต์ 'class' เท่ากับ 'square2'
var elements = document.QuerySelectorAll(".square2");

// วนซ้ำรายการองค์ประกอบผลลัพธ์
foreach (Aspose.Html.HTMLElement element in elements)
{
    // ตั้งค่าแอตทริบิวต์สไตล์ด้วยคุณสมบัติสีพื้นหลังใหม่
    element.Style.BackgroundColor = "#b0d7fb";
}

// บันทึกเอกสาร HTML ลงในไฟล์
document.Save(savePath);

สำรวจ Aspose.HTML for .NET

คุณสามารถไปที่พื้นที่ เอกสาร เพื่อสำรวจบทต่างๆ ที่เกี่ยวข้องกับคุณลักษณะต่างๆ ของ API

รับใบอนุญาตฟรี

คุณสามารถประเมิน API ได้เต็มประสิทธิภาพโดยขอ ใบอนุญาตชั่วคราวฟรี

บทสรุป

ในบทความนี้ คุณได้เรียนรู้วิธีใช้ตัวเลือก CSS ในขณะที่พิจารณาตัวอย่างของตัวเลือก QuerySelector และ QuerySelectorAll ในกรณีที่มีข้อสงสัยใด ๆ โปรดเขียนถึงเราที่ ฟอรั่ม

ดูสิ่งนี้ด้วย

รวมไฟล์ EPUB ใน C#