الدرس الخامس -الاحداث

 

الاحداث Events :

هي أشياء تحث الي صفحات  HTML

عند استخدام الـjs  في صفحات HTML  فان  JS  تتفاعل مع هذه الاحداث .

احداث HTML  

  • عند تحميل الصفحة
  • عند تغير في حقل ادخال  .
  • عند الضغط علي زر .

<element event='some JavaScript'>

مثال :

     عند الضغط علي زر يتم طباعة التاريخ مع الحدث onclick    

قم باشاء  <*p>  id =demo

 

<button onclick="document.getElementById('demo').innerHTML = Date()">The time is?</button>

استخدم هذا الكود ولاحظ الفرق

<button onclick="this.innerHTML = Date()">The time is?</button>

 

طريقة أخرى :

استخدام الاحداث مع الدوال .

 

<!DOCTYPE html>

<html>

<body>

 

<p>Click the button to display the date.</p>

 

<button onclick="displayDate()">The time is?</button>

 

<script>

function displayDate() {

  document.getElementById("demo").innerHTML = Date();

}

</script>

 

<p id="demo"></p>

 

</body>

</html>

 

 

 

بعض الاحداث الأخرى :

 

الحدث

التفصيل

onchange

عند تغير عنصر html

onmouseover

عند تحريك الماوس علي عنصر html

onmouseout

عند ابعاد الماوس عن العنصر

Onkeydown

عند الضغط علي أي زر في لوحة المفاتيح

onload

عند الانتهاء من تحميل الصفحة