Map areas ກຸ່ມ

ການນຳໃຊ້ ແລະ ຄວາມຈິງ

area ກຸ່ມກັບຄືນທຸກສັບສັດ <area> ສັບສັດ ກຸ່ມຂອງມັນ。

ຄວາມຄິດ:ວັດຖຸໃນການຈັດອອກແມ່ນຕາມອິດທິພົນຂອງພາບຄູ່ມູນໃນເຄື່ອງເບິ່ງ:

ຄຳເຕືອນ:ຖ້າຕ້ອງກັບຄືນທຸກຂໍ້ມູນ href <area> ສັບສັດ ກຸ່ມຂອງມັນ,ກະລຸນາໃຊ້ links ກຸ່ມ

ຕົວຢ່າງ

ຕົວຢ່າງ 1

ການກວດສອບຈຳນວນ <area> ທີ່ມີຢູ່ໃນຕາມລັກສະນະພາບຕາມລັກສະນະທີ່ກຳນົດ:

var x = document.getElementById("planetmap").areas.length;

ທົດລອງເອງ

ຜົນການຂອງ x ແມ່ນ:

3

ມີຕົວຢ່າງ TIY ຫຼາຍກວ່ານັ້ນຢູ່ດ້ານກ້ອງຂອງເວັບໄຊ:

ສັບສິນວິທະຍາ:

mapObject.areas

ອາການ

ຄູ່ມູນ ການອະທິບາຍ
length

ກັບຄືນວຽກຂອງ <area> ໃນການຈັດອອກ:

ຄວາມຄິດ:ອາການນີ້ແມ່ນພຽງການອານຸພາສາຫຼັງການເບິ່ງ:

ວິທີການ

ວິທີການ ການອະທິບາຍ
[index]

ກັບຄືນວຽກກັບສະແດງທີ່ມີເຈັດຈິງຢູ່ໃນການຈັດອອກ (ເລີ່ມຈາກ 0):

ຄວາມຄິດ:ຖ້າເຈັດຈິງຫຼາຍຢູ່ຈະກັບຄືນ null.

item(index)

ກັບຄືນວຽກກັບສະແດງທີ່ມີເຈັດຈິງຢູ່ໃນການຈັດອອກ (ເລີ່ມຈາກ 0):

ຄວາມຄິດ:ຖ້າເຈັດຈິງຫຼາຍຢູ່ຈະກັບຄືນ null.

namedItem(id)

ກັບຄືນຕອນມີ id ຂອງ <area> ໃນການຈັດອອກ:

ຄວາມຄິດ:ຖ້າ id ບໍ່ມີຢູ່ຈະກັບຄືນ null.

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

DOM Version: Core Level 2 Document Object
ຜົນການກັບຄືນ:

HTMLCollection Object, ສະແດງວຽກກັບສະແດງຂອງ <area> ທັງໝົດໃນເຄື່ອງເບິ່ງ:

ວັດຖຸໃນການຈັດອອກແມ່ນຕາມອິດທິພົນຂອງພາບຄູ່ມູນໃນເຄື່ອງເບິ່ງ:

ການສະໜັບສະໜູນຕະຫຼອດຕາມການບັນທຶກຄູ່ມູນໃນເຄື່ອງເບິ່ງ:

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

ຕົວຢ່າງຫຼາຍກວ່ານັ້ນ

ຕົວຢ່າງ 2: [index]

ການຄົ້ນຫາ URL ຂອງ <area> ທີ່ແຕ່ລະພາບຂອງຕາມລັກສະນະພາບຕາມລັກສະນະທຳອິດ:

var x = document.getElementById("planetmap").areas[0].href;

ທົດລອງເອງ

ຜົນຂອງ x ຈະເປັນ:

https://www.codew3c.com/jsref/sun.html

ຕົວຢ່າງ 3: item(index)

ການຄົ້ນຫາ URL ຂອງ <area> ທີ່ແຕ່ລະພາບຂອງຕາມລັກສະນະພາບຕາມລັກສະນະທຳອິດ:

var x = document.getElementById("planetmap").areas.item(0).href;

ທົດລອງເອງ

ຜົນຂອງ x ຈະເປັນ:

https://www.codew3c.com/jsref/sun.html

ຕົວຢ່າງ 4: namedItem(id)

ການຄົ້ນຫາ URL ຂອງ <area> ທີ່ id="myArea" ໃນຕາມລັກສະນະພາບຕາມລັກສະນະ:

var x = document.getElementById("planetmap").areas.namedItem("myArea").href;

ທົດລອງເອງ

ຜົນຂອງ x ຈະເປັນ:

https://www.codew3c.com/jsref/mercur.html

ຕົວຢ່າງ 5

ການເບິ່ງຂໍ້ມູນສະແດງຮູບພາບທັງໝົດໃນຕາມລັກສະນະ <area> ແລະການອອກພາບວຽກຂອງແຕ່ລະພາບຂອງພາບຕາມລັກສະນະ:

var x = document.getElementById("planetmap");
var txt = "";
var i;
for (i = 0; i < x.areas.length; i++) {
  txt = txt + x.areas[i].shape + "<br>";
}

ທົດລອງເອງ

ຜົນຂອງ x ຈະເປັນ:

rect
circle
circle