HTML DOM Element clientHeight Property

ການສະເໜີ ແລະ ການນໍາໃຊ້

clientHeight ບັນດາບາດດິນແບບແມ່ນກຳນົດຄວາມສູງທີ່ສາມາດເບິ່ງໄດ້ຂອງບັນດາບັນດາບາດດິນແບບ, ລວມທັງການກະຈາຍບາງສ່ວນ, ບໍ່ລວມບາງສ່ວນບໍລິສຸກ, ບາງສ່ວນຄົ້ນຫາ ຫຼື ບາງສ່ວນການກະຈາຍນອກ, ສາມາດກຳນົດໃນຕາມປະກອບພິກັນ.

clientHeight ປະເພດຂອງບັນດາບັນດາບາດດິນແບບແມ່ນຂໍ້ສັງເກດ.

ອ່າງວິທີ:ການສິ່ງສອນວິທີ CSS Box Model

ອ່າງວິທີ:

ຄວາມວົງ clientWidth

ຄວາມສູງ clientTop

ຄວາມວົງ clientLeft

ຄວາມສູງ offsetHeight

ຄວາມວົງ offsetWidth

ສຳລັບການເພີ່ມສາມາດຄົ້ນຫາໃຫ້ບັນດາບັນດາບາດດິນແບບ, ຂ້ອຍຫວັງວ່າ: ຄວາມລາຍງານຂອງ CSS overflow

ຄວາມພິຈາລະນາ

ຕົວຢ່າງ 1

ການຄົ້ນຫາຄວາມສູງ ແລະ ຄວາມວົງຂອງ "myDIV" ລວມທັງການກະຈາຍບາງສ່ວນ:

const element = document.getElementById("myDIV");
let text = "clientHeight: " + element.clientHeight + "px<br>";
text += "clientWidth: " + element.clientWidth + "px";

ທ້າທາຍຕົວເອງ

ຕົວຢ່າງ 2: clientHeight/clientWidth ແລະ offsetHeight/offsetWidth ຂອງຄວາມແຕກຕ່າງ

ບໍ່ມີສາມາດຄົ້ນຫາ:

const element = document.getElementById("myDIV");
let text = "";
text += "clientHeight: " + element.clientHeight + "px<br>";
text += "offsetHeight: " + element.offsetHeight + "px<br>";
text += "clientWidth: " + element.clientWidth + "px<br>";
text += "offsetWidth: " + element.offsetWidth + "px";

ທ້າທາຍຕົວເອງ

ມີສາມາດຄົ້ນຫາ:

const element = document.getElementById("myDIV");
let text = "";
text += "clientHeight: " + element.clientHeight + "px<br>";
text += "offsetHeight: " + element.offsetHeight + "px<br>";
text += "clientWidth: " + element.clientWidth + "px<br>";
text += "offsetWidth: " + element.offsetWidth + "px";

ທ້າທາຍຕົວເອງ

ຄຳສັບພາສາ

element.clientHeight

ຜົນກະທົບ

ປະເພດ ການອະທິບາຍ
ຈຳນວນ ຄວາມສູງທີ່ສາມາດເບິ່ງໄດ້ຂອງບັນດາບັນດາບາດດິນແບບ (ສາມາດກຳນົດໃນຕາມປະກອບພິກັນ), ລວມທັງການກະຈາຍບາງສ່ວນ.

ສະໜັບສະໜູນບັນດາບັນດາບາດດິນແບບ

ທຸກບັນດາບັນດາຄົນໄດ້ສະໜັບສະໜູນ element.clientHeight

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
ສະໜັບສະໜູນ ສະໜັບສະໜູນ ສະໜັບສະໜູນ ສະໜັບສະໜູນ ສະໜັບສະໜູນ ສະໜັບສະໜູນ