สำหรับชั้นเรียน,คุณสามารถใช้ document.querySelectorAll() พร้อมกับ css selectors เหมือนนี้:
document.querySelector('button').addEventListener('click', () => {
document.querySelectorAll('.cake')[0].style.display = 'none';
});
<div class="cake forest carousel">Some content I want to hide.</div>
<button>Hide content</button>
กับ classNames จำได้ไหมว่าคุณสามารถกำหนดทั้งหมด classNames(บางครั้งนั่นเป็นประโยชน์เพื่อบ่งบอกหนึ่งธาตุถ้ามันยังมีอีกส่วนประกอบที่มีส่วนหนึ่งของ classList:
document.querySelectorAll('.cake.forest.carousel')[0] . . .
ยังโน๊ตนั่น document.querySelectorAll() จะได้ค่าเป็น คลังสื่อยังไม่มีข้อความ-นั่นคือทำไมมันจำเป็นต้องใช้ [0] เครื่องหมายไว้ที่ปฎิทินต้องเลือกแรกธาตุกลับมาในคลังภาพ
ใช้ getElementsByClassName() เป็นเหมือนกัวามคิดอีกทีมันกลับมาคอลเล็คชั่นหนึ่งต้องเหมือนกัใช้ [0] เครื่องหมายไว้ที่ปฎิทินจะต้องไปที่ธาตุก่อน(ตามปกติถ้าเพียงหนึ่งคือกลับมา),หรือ forEach() เรื่องต้องเลือกที่ต้องการอีลีเมนต์จากอีกเงื่อนไขการเรียงลำดับ.
document.querySelector('button').addEventListener('click', () => {
document.getElementsByClassName('cake forest')[0].style.display = 'none';
});
<div class="cake forest carousel">This div has classes cake, forest and carousel</div>
<div class="cake">This div only has class cake</div>
<button>Hide divs with classes cake AND forest</button>
