ການສັບສົນ JavaScript HTML DOM ການກະທຳ

HTML DOM ອະນຸຍາດ JavaScript ຕອບສະໜອງອັນຕະລາງ:

ມີການຫາງມາ!
ຄຳສັ່ງຂອງຂ້ອຍ

ຕອບສະໜອງອັນຕະລາງ

JavaScript ສາມາດດຳເນີນການໃນເວລາທີ່ອັນຕະລາງເກີດຂຶ້ນ, ອີງຕາມວ່າຜູ້ນຳໃຊ້ຄຳກັບມືກິນຄອມພິວເຕີ້ຄຳກັບອັນຕະລາງ HTML ບາງຢ່າງ.

ເພື່ອດຳເນີນການຂອງລະບົບ JavaScript ໃນເວລາທີ່ຜູ້ນຳໃຊ້ຄຳກັບມືກິນຄອມພິວເຕີ້, ຂ້ອຍກຳລັງສະເໜີ JavaScript ໃຫ້ເປັນຜົນຂອງອັນຕະລາງຂອງອາລະສາດ HTML:

onclick=JavaScript

ບັນດາອັນຕະລາງຂອງ HTML:

  • ບ່າງເວລາທີ່ຜູ້ນຳໃຊ້ຄຳກັບມືກິນຄອມພິວເຕີ້
  • ເມື່ອເວັບໄຊ ຖືກອອກຮູບແບບ:
  • ເມື່ອບາງບານຂໍ້ມູນ ຖືກອອກຮູບແບບ:
  • ເມື່ອອາສານມຸມຂອງມັນ ຖືກປ່ຽນ:
  • ເມື່ອບາງບານຂໍ້ມູນ ຖືກປ່ຽນ:
  • ເມື່ອ HTML form ຖືກການສົ່ງ:
  • ເມື່ອຜູ້ນຳໃຊ້ກົດດັນປະຕູ:

ໃນຕົວຢ່າງນີ້, ເມື່ອຜູ້ນຳໃຊ້ຄົ້ນຫາ: <h1> ຈະປ່ຽນຂໍ້ຄວາມຂອງມັນ:

ຕົວຢ່າງ

<!DOCTYPE html>
<html>
<body>
<h1 onclick="this.innerHTML = 'Hello!'">ການຄົ້ນຫາຂໍ້ຄວາມນີ້!</h1>
</body>
</html>

ສວດມືວັນນີ້

ໃນຕົວຢ່າງນີ້, ຈະເອິ້ນຕົວອອກການຕາມ event handler:

ຕົວຢ່າງ

<!DOCTYPE html>
<html>
<body>
<h1 onclick="changeText(this)">ການຄົ້ນຫາຂໍ້ຄວາມນີ້!</h1>
<script>
function changeText(id) { 
    id.innerHTML = "Hello:)";
}
</script>
</body>
</html>

ສວດມືວັນນີ້

HTML Event Attribute

ສຳລັບຈະຈັດການບາງບານການເກີດເຫດຂອງ HTML element, ພວກເຈົ້າສາມາດໃຊ້ attribute ການເກີດເຫດ.

ຕົວຢ່າງ

ຈະຈັດການບາງບານການເກີດເຫດຂອງ button onclick ການເກີດເຫດ:

<button onclick="displayDate()">ສາຍຕື່ມ</button>

ສວດມືວັນນີ້

ໃນຕົວຢ່າງນີ້, ການຈັດການຂອງຕົວອອກການ displayDate ຈະປະຕິບັດຕາມການຄັດຄ້ານຂອງຖະໜົນ

ຈັດການບາງບານການເກີດເຫດຂອງ HTML DOM

HTML DOM ອະນຸຍາດໃຫ້ພວກເຈົ້າຈະຈັດການບາງບານການເກີດເຫດຂອງ HTML element ໃຊ້ JavaScript:

ຕົວຢ່າງ

ຈະຈັດການບາງບານຂອງ button onclick ການເກີດເຫດ:

<script>
document.getElementById("myBtn").onclick = displayDate;
</script>

ສວດມືວັນນີ້

ໃນຕົວຢ່າງນີ້, ການຈັດການຂອງຕົວອອກການ displayDate ໄດ້ຖືກຈັດການໃຫ້ມີ id="myBtn"

ການປະຕິບັດການຕອນການຄັດຄ້ານ

onload ແລະ onunload 事件

ຖ້າຜູ້ນຳໃຊ້ເຂົ້າເຫດການ ແລະ ອອກເຫດການ, ຈະເກີດການປະຕິບັດ onload 和 onunload ການເກີດເຫດ

onload ການເກີດເຫດຈະມີການກວດກາບາງບານຂໍ້ມູນຂອງຜູ້ນຳໃຊ້, ແລະ ຂອງການປ່ຽນຂອງບາງບານຂໍ້ມູນ, ແລະ ຈະອອກຮູບແບບຂອງຂໍ້ມູນທີ່ຈະບັນທຶກ

onload 和 onunload ການເກີດເຫດຈະມີການຈັດການ cookie

ຕົວຢ່າງ

<body onload="checkCookies()">

ສວດມືວັນນີ້

onchange 事件

onchange ການເກີດເຫດ oninput ທີ່ຈະມີການປະສົມປະສານກັບການກວດກາບາງບານຂໍ້ມູນ

ລາວກໍ່ມີການນຳໃຊ້ onchange ຂອງຄວາມ. ເມື່ອຜູ້ນຳໃຊ້ປ່ຽນຂໍ້ຄວາມຂອງບາງບານຂໍ້ມູນ, ຈະເອິ້ນຕົວອອກການ upperCase()

ຕົວຢ່າງ

<input type="text" id="fname" onchange="upperCase()">

ສວດມືວັນນີ້

ການເກີດເຫດ onmouseover ແລະ onmouseout

onmouseover 和 onmouseout 事件可用于当用户将鼠标移至 HTML 元素上或移出时触发某个函数：

ມີການຫາງມາ!

ສວດມືວັນນີ້

ການເກີດການເຫດການ onmousedown, onmouseup ແລະ onclick

onmousedown, onmouseup ແລະ onclick ການເກີດການເຫດການບັນທຶກການຄຳສັ່ງບານການເປັນຢ່າງສະໜັບສະໜູນ

ສຸດທ້າຍ, ພາຍຫຼັງຈາກການຄຳສັ່ງບານການເປັນຢ່າງສະໜັບສະໜູນonmousedown ການເກີດການເຫດການ; ຕໍ່ມາ, ພາຍຫຼັງຈາກການປົດບານການເປັນຢ່າງສະໜັບສະໜູນonmouseup ການເກີດການເຫດການ; ສຸດທ້າຍ, ຫຼັງຈາກການຄຳສັ່ງບານການເປັນຢ່າງສະໜັບສະໜູນonclick ການເກີດການເຫດການ

ຄຳສັ່ງຂອງຂ້ອຍ

ສວດມືວັນນີ້

ຫຼາຍກໍານົດຕື່ມ

onmousedown ແລະ onmouseup
ປ່ຽນພາບຫຼັງຈາກການສັງວົນບານການເປັນຢ່າງສະໜັບສະໜູນ
onload
ສະແດງສັນຍາບັນບາດຫຼັງຈາກການເຕັມໄປຂອງສະຖານີ
onfocus
ປ່ຽນສີຂອງພາບຫຼັງຈາກການເຂົ້າຫຼັງຂອງບານການເຂົ້າສູນ
ການເຫດການດ້ວຍເມືອງ
ປ່ຽນສີຂອງສິ່ງພົບໃນສະຖານະພາບພະຍາຍາມຖ້າຂັ້ນສັນຍາບັນບາດຄ້າງໄປຫາສິ່ງພົບ

ການອະທິບາຍ Event HTML DOM

ສຳລັບການເບິ່ງລາຍການ Event HTML DOM ທັງໝົດ, ກະລຸນາເຂົ້າມາຊົມບັນຫາທັງໝົດຂອງພວກເຮົາ ການອະທິບາຍ Event HTML DOM。