ด้วยข้อมูลโค้ดที่ละเอียดนี้ คุณสามารถเพิ่มแอตทริบิวต์ ID ให้กับองค์ประกอบ HTML ที่มีอยู่ได้โดยใช้ JavaScript
เดอะโค้ด
let featuredTitle = document.querySelector("h1");
featuredTitle.id = "featured-title";สิ่งที่เกิดขึ้นในวิดีโอมีดังนี้
- อันดับแรก เราพบองค์ประกอบ h1 บนหน้าเว็บและกำหนดให้กับตัวแปรชื่อ
featuredTitle. - จากนั้น เราแนบแอตทริบิวต์ ID กับตัวแปรนั้นโดยใช้เครื่องหมายจุด (variableName.attribute) ในกรณีนี้:
featuredTitle.idและให้ค่า'featured-title'.
คุณสามารถทำเช่นนี้กับองค์ประกอบที่มีอยู่ใน DOM ได้
ตอนนี้คุณสามารถใช้ ID ที่สร้างขึ้นแบบไดนามิกนี้เพื่อเชื่อมต่อกับ CSS (เพื่อจัดรูปแบบองค์ประกอบผ่าน ID ใหม่) หรือด้วย JavaScript สำหรับการจัดการพฤติกรรมเชิงโต้ตอบ (เช่นเหตุการณ์การคลิก)
