เมธอด querySelectorAll
เมธอด querySelectorAll ช่วยให้สามารถได้มาซึ่ง
องค์ประกอบของหน้าตามซีเล็กเตอร์
CSS ใดๆ โดยสามารถดำเนินการต่างๆ
กับองค์ประกอบที่ได้มานั้นได้:
เปลี่ยนแปลง
ข้อความ, แอตทริบิวต์, สไตล์ CSS และอื่นๆ
ไวยากรณ์
javascriptdocument.querySelectorAll(ซีเล็กเตอร์);
ตัวอย่าง
ลองมาดูวิธีการได้มาซึ่งองค์ประกอบทั้งหมดที่มีคลาส www
และเปลี่ยนแปลงข้อความของพวกมันด้วยคุณสมบัติ textContent:
html<p class="www">องค์ประกอบ 1</p>
<p class="www">องค์ประกอบ 2</p>
<p class="www">องค์ประกอบ 3</p>javascriptlet elems = document.querySelectorAll('.www');
for (let elem of elems) {
elem.textContent = '!!!';
}
ผลลัพธ์จากการทำงานของโค้ด:
html<p class="www">!!!</p>
<p class="www">!!!</p>
<p class="www">!!!</p>
ดูเพิ่มเติม
-
เมธอด
querySelector,
ซึ่งได้มาซึ่งองค์ประกอบตามซีเล็กเตอร์ -
เมธอด
getElementsByClassName,
ซึ่งได้มาซึ่งกลุ่มองค์ประกอบตามคลาส -
เมธอด
getElementsByTagName,
ซึ่งได้มาซึ่งกลุ่มองค์ประกอบตามแท็ก