Style visibility ຄວາມຄົບພິການ

ການກໍານົດຄວາມພິການຂອງເນື້ອທີ່

visibility ຄວາມຄົບພິການອາດຕັ້ງຕັດຫຼືກັບຄືນຄວາມຄົບພິການຂອງສິ່ງ.

visibility ຄວາມຄົບພິການອາດສະແດງຫຼືປິດສິ່ງຫຼັກການຂອງຜູ້ປະພັນ.

ຄວາມຄົບພິການນີ້ຄ້າຍຄືກັນ: display ຄວາມຄົບພິການ。ແຕ່ຕື່ມອີກວ່າຖ້າທີ່ຈະຕັ້ງຕັດ: display:none،ຈະປິດຄວາມໝາຍສິ່ງທັງໝົດຂອງສິ່ງໃດນັ້ນຫຼັງຈາກນັ້ນກໍ່ຕາມ: visibility:hidden ຄວາມໝາຍວ່າສິ່ງຄົບພິການຈະບໍ່ເຫັນໄດ້ແຕ່ຈະພັກພື້ນທີ່ແລະຂະໜາດທີ່ບໍ່ໄດ້ປ່ຽນໄປ.

ຍັງບໍ່ມີຂໍ້ມູນອື່ນໆ:

ການສອນ CSS:CSS Display ແລະ visibility

ການຫຼັກສູດ CSS:visibility ຄວາມຄົບພິການ

ຄວາມນິຍາຍ

ຄວາມນິຍາຍ 1

ປິດຄວາມໝາຍຂອງ <p> ສັນຍານ:

document.getElementById("myP").style.visibility = "hidden";

亲自试一试

ມີຫຼັກຖານຫຼາຍຫຼັງພົມໃນເວລາຕໍ່າກັນ.

ຄຼີມກົດລະບຽບ

ກັບຄືນ visibility ຄວາມຄົບພິການ：

object.style.visibility

ແຕ່ງຕັ້ງ visibility ຄວາມຄົບພິການ：

object.style.visibility = "visible|hidden|collapse|initial|inherit"

ຄຳຕອບກັບ

ຄຳຕອບກັບ: ການອະທິບາຍ:
visible ສະແດງ:
ອຸປະກອນສາມາດເບິ່ງໄດ້. ຄຳຕອບກັບຄົນທີ່ສະເຫຼງ. hidden
ອຸປະກອນບໍ່ສາມາດເບິ່ງໄດ້(ຄືກັບ "hidden"). collapse
initial ການຈັດຕັ້ງລະບົບສຳລັບຄຳຕອບກັບສະເຫຼງ. ບັນດາຄວາມ: initial.
inherit ຍິນຍອມຕາມລະບົບພໍ່ຂອງບັນດາອຸປະກອນ. ບັນດາຄວາມ: inherit.

ຂໍ້ມູນດ້ານເຕັກນິກ:

ຄຳຕອບກັບຄົນທີ່ສະເຫຼງ: visible
ຄຳຕອບກັບ: ຄຳເວົ້າຊາວຄຳສະແດງວ່າອຸປະກອນທີ່ສາມາດເບິ່ງໄດ້ຫຼືບໍ່:
ສະພາບ CSS: CSS2

ສະຫະພັນບັນດາຄົນບາດບານ:

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
ສະຫະພັນ: ສະຫະພັນ: ສະຫະພັນ: ສະຫະພັນ: ສະຫະພັນ:

ຕົວຢ່າງຫຼາຍກວ່າ:

ຕົວຢ່າງ 2

ຄວາມແຕກຕ່າງລະບົບ display ແລະ visibility:

function demoDisplay() {
  document.getElementById("myP1").style.display = "none";
}
function demoVisibility() {
  document.getElementById("myP2").style.visibility = "hidden";
}

亲自试一试

ຕົວຢ່າງ 3

ການປ່ຽນກັບລະບົບປິດແລະສະແດງອຸປະກອນ:

function myFunction() {
  var x = document.getElementById('myDIV');
  if (x.style.visibility === 'hidden') {
    x.style.visibility = 'visible';
  } else {
    x.style.visibility = 'hidden';
  }
}

亲自试一试

ຕົວຢ່າງ 4

ການປິດແລະສະແດງ <img> ອຸປະກອນ:

function hideElem() {
  document.getElementById("myImg").style.visibility = "hidden"; 
}
function showElem() {
  document.getElementById("myImg").style.visibility = "visible"; 
}

亲自试一试

ຕົວຢ່າງ 5

ການກັບຄືນຮູບຮ່າງ <p> ທີ່ສາມາດເບິ່ງໄດ້:

alert(document.getElementById("myP").style.visibility);

亲自试一试