ဂျေဟိုစတာ ဟိုင်တာ ဒိုင်မတ် ဖြစ်ပွား

HTML DOM 允许 JavaScript 对 HTML 事件作出反应：

鼠标移上来！
点击我

对事件作出反应

JavaScript 能够在事件发生时执行，比如当用户点击某个 HTML 元素时。

为了在用户点击元素时执行代码，请向 HTML 事件属性添加 JavaScript 代码：

onclick=JavaScript

HTML အချက်အလက် အကျိုးဆက်

  • အသုံးပြုသူ မိခင်းမှတ်တမ်းချို့ပြီး
  • 当网页加载后
  • 当图像加载后
  • အသုံးပြ�သူသည် အအုပ်အချက်အား အစားထိုးလာပါက:
  • အသုံးပြ�သူသည် အရေးသားစာသင်းအရာကို ပြောင်းလဲလာပါက:
  • HTML ပြုစုမှုအဖွဲ့အစည်းကို တိုက်ရိုက်ပေးလိမ့်မည်:
  • အသုံးပြ�သူသည် ဘေ့စ်ဘက်ပတ်ကို စတင်ပြုလုပ်လာပါက:

အမှတ်ပြုသည့် displayDate အမည်ရှိ လုပ်ငန်းကို အသုံးပြု၍ အခမ်းကို ခေါ်ဆိုလိမ့်မည်: <h1> အခမ်းကို အခြေခံပြု၍ အရိုးကို ပြောင်းလဲလိမ့်မည်:

အကျိုးသုံး

<!DOCTYPE html>
<html>
<body>
<h1 onclick="this.innerHTML = 'Hello!'">အများပြည်သူတွင်းမှ အများအသုံးပြုကြသည်</h1>
</body>
</html>

亲自试一试

အကျိုးသုံး၌ အခမ်းသူ့လုပ်ငန်းကို ခေါ်ဆိုလိမ့်မည်:

အကျိုးသုံး

<!DOCTYPE html>
<html>
<body>
<h1 onclick="changeText(this)">အများပြည်သူတွင်းမှ အများအသုံးပြုကြသည်</h1>
<script>
function changeText(id) { 
    id.innerHTML = "Hello:)";
}
</script>
</body>
</html>

亲自试一试

HTML အခမ်းအရိုး

HTML အအုပ်အချက်အတွက် အခမ်းချုပ်ထိန်းရန် သင့်သည့် အခမ်းအရိုးကို အသုံးပြုနိုင်သည်。

အကျိုးသုံး

button အအုပ်အချက်အတွက် onclick အခမ်း:

<button onclick="displayDate()">ကျင့်သုံးကြည်း</button>

亲自试一试

အမှတ်ပြုသည့် displayDate အမည်ရှိ လုပ်ငန်းသည် ဘေ့စ်ဘက်ပတ်ကို စတင်ပြုလုပ်လာပါက စတင်ပြုလုပ်လာသည်。

HTML DOM ကို အခမ်းချုပ်ထိန်းခြင်း

HTML DOM ကို အသုံးပြု၍ JavaScript ကို HTML အအုပ်အချက်အတွက် အခမ်းများ ချုပ်ထိန်းနိုင်သည်:

အကျိုးသုံး

button အအုပ်အချက်အတွက် onclick အခမ်း:

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

亲自试一试

အမှတ်ပြုသည့် HTML အအုပ်အချက်ကို နားမြင်ကြောင်း။ displayDate အမည်ရှိ လုပ်ငန်းကို id="myBtn" အမည်ရှိ HTML အအုပ်အချက်သို့ ချုပ်ထိန်းထားပါသည်。

ဘေ့စ်ဘက်ပတ်သည် စတင်ပြုလုပ်လာသည်。

onload နှင့် onunload အခမ်း

အသုံးပြ�သူသည် စာမူသို့ ရောက်ရှိလာပြီး စာမူမှ ထွက်သွားလာပါက၊ onload 和 onunload အခမ်း

onload အခမ်းကို ထိုသို့ ကမ်းသတ်လေ့ရှိသည်။

onload 和 onunload အခမ်းကို အက်ဆပ်စာချောင်းအခမ်းကို ပြုလုပ်နိုင်သည်。

အကျိုးသုံး

<body onload="checkCookies()">

亲自试一试

onchange အခမ်း

onchange အခမ်းကို အရေးသားစာသင်းအရာအသိအသင့်အတွက် ပူးပေါင်းအသုံးပြုလေ့ရှိသည်。

အခမ်း၏ အသုံးပြုပုံ 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
当输入字段获得焦点时改变其背景色。
鼠标事件
当指针移动到元素上时改变其颜色。

HTML DOM Event 对象参考手册

如需所有 HTML DOM 事件的列表，请访问我们完整的 HTML DOM 事件对象参考手册。