วิธี querySelector
วิธี querySelector ช่วยให้ได้รับ
องค์ประกอบของหน้าตามตัวเลือก CSS ใดก็ได้
กับองค์ประกอบที่ได้รับ คุณสามารถดำเนินการ
ต่างๆ ได้: เปลี่ยนข้อความ,
แอตทริบิวต์, สไตล์ CSS และอื่นๆ
ไวยากรณ์
document.querySelector(ตัวเลือก);
ตัวอย่าง
ลองรับย่อหน้า #elem และเปลี่ยน
ข้อความของมันโดยใช้ textContent:
<p id="elem">ข้อความ</p>
let elem = document.querySelector('#elem');
elem.textContent = '!!!';
ผลลัพธ์ของการทำงานโค้ด:
<p id="elem">!!!</p>
ตัวอย่าง
ลองรับย่อหน้าที่มีคลาส elem
และเปลี่ยนข้อความของมัน:
<p class="elem">ข้อความ</p>
let elem = document.querySelector('.elem');
elem.textContent = '!!!';
ผลลัพธ์ของการทำงานโค้ด:
<p id="elem">!!!</p>
ดูเพิ่มเติม
-
วิธี
getElementById,
ซึ่งได้รับองค์ประกอบตามid -
วิธี
querySelectorAll,
ซึ่งได้รับกลุ่มขององค์ประกอบตามตัวเลือก