HTML DOM Document getElementsByClassName() ກົດລະບຽບ

ການອະທິບາຍ ແລະ ການນໍາໃຊ້

getElementsByClassName() ກົດລະບຽບກັບມາບອກປະກອບທີ່ມີປະເພດຄຳນວຍງານທີ່ກຳນົດຄວາມສະແດງ.

getElementsByClassName() ກົດລະບຽບກັບມາບອກ: HTMLCollection.

getElementsByClassName() ຜົນຂອງປະເພດແມ່ນມີພຽງແຕ່ຄົ້ນຫາ.

HTMLCollection

HTMLCollection ເປັນສະໝອງທີ່ຄືກັບ HTML ສິບປະກອບ (ລາຍການ).

ສາມາດເຂົ້າເຖິງສິບປະກອບໃນການເບິ່ງທີ່ມີຕົວເລກ (ຈາກ 0 ເປັນຫຼັງ).

length ຜົນຂອງທາງປະສົມປະກອບແມ່ນຈຳນວນສິບປະກອບໃນການເບິ່ງທີ່ມີຕົວເລກ.

ບໍ່ດັງຄົ້ນຫາ:

getElementById() ກົດລະບຽບ

getElementsByTagName() ກົດລະບຽບ

querySelector() ກົດລະບຽບ

querySelectorAll() ກົດລະບຽບ

ໂອບເອັມໂຕເລັກຊັນ ທີ່ຄືກັບສະໝອງ

ຄວາມນົວ

ຄວາມນັບ 1

ການຄົ້ນຫາປະກອບປະກອບທີ່ມີ class="example":

const collection = document.getElementsByClassName("example");

ທ້າວທາງການທົດລອງ

ຄວາມນັບ 2

ການຄົ້ນຫາປະກອບປະກອບທີ່ມີປະເພດ "example" ແລະ "color":

const collection = document.getElementsByClassName("example color");

ທ້າວທາງການທົດລອງ

ບັນດາຫຼັງສານ 3

ຈຳນວນບັນດາວິທະຍາໂດມທີ່ມີ class="example":

let numb = document.getElementsByClassName("example").length;

ທ້າວທາງການທົດລອງ

ບັນດາຫຼັງສານ 4

ການປ່ຽນສີທີ່ຫຼັງຄືນຂອງບັນດາບັນດາວິທະຍາໂດມທີ່ມີ class="example":

const collection = document.getElementsByClassName("example");
for (let i = 0; i < collection.length; i++) {
  collection[i].style.backgroundColor = "red";
}

ທ້າວທາງການທົດລອງ

ຄຳສັບພາສາ

document.getElementsByClassName("example")classname)

ພາສາ

ພາສາ ການອະທິບາຍ
classname

ສະເພາະ. ຊື່ວິທະຍາວິທະຍາໂດມ.

ສາມາດຄົ້ນຫາຊື່ວິທະຍາວິທະຍາໂດມທີ່ຖືກຂ້າງຄຽງດ້ວຍຄວາມນັ່ງ, ເຊິ່ງອາດຈະເປັນ "test demo".

ຄຳຕອບສະໜອງ

ຮູບແບບ ການອະທິບາຍ
ວັດຖຸ

ວັດຖຸ HTMLCollection

ການຈັດການສອງຄັ້ງທີ່ມີຄວາມຫຼັກທີ່ມີຊື່ວິທະຍາວິທະຍາໂດມ.

ຈັດການສອງຄັ້ງທີ່ມີຄວາມຫຼັກໃນໂຕເຫຼັກຂອງເອກະສານ.

ການສະໜັບສະໜູນບັນດາບັນດາບັນດາ

document.getElementsByClassName() ເປັນຄວາມຫຼັກ DOM Level 1 (1998) ລັກສະນະ.

ທຸກບັນດາບັນດາບັນດາທັງໝົດການສະໜັບສະໜູນມັນ:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
ການສະໜັບສະໜູນ 9-11 ການສະໜັບສະໜູນ ການສະໜັບສະໜູນ ການສະໜັບສະໜູນ ການສະໜັບສະໜູນ

ບັນດາຫຼັງສານທີ່ກ່ຽວຂ້ອງ

ການສອນ CSS:ວິທະຍຸ CSS

ປືກສາ CSS:ການເລືອກ .class CSS

ປືກສາ HTML DOM:element.getElementsByClassName()

ປືກສາ HTML DOM:ປະເພດ className

ປືກສາ HTML DOM:ປະເພດ classList

ປືກສາ HTML DOM:ວັດຖຸ Style