تعریف کلی از رویداد ها Events و بررسی عملی رویداد onclick در JS

یک رویداد چیست؟

تعامل جاوا اسکریپت با HTML از طریق رویدادهایی (events) صورت می پذیرد. رویدادها وقتی رخ می دهند که کاربر یا مرورگر یک صفحه را دستکاری می نماید.

وقتی صفحه ای بارگذاری می شود ، یک رویداد فراخوانی می گردد. هنگامی که کاربر یک کلید را کلیک می کند، فرآیند کلیک کردن نیز یک رویداد است. مثال های دیگر برای رویدادها می توانند شامل فشار دادن یک کلید، بستن پنجره ای یا تغییر اندازه یک پنجره و سایر موارد باشند.

توسعه دهندگان، می توانند از این رویدادها برای اجرای پاسخ های جاوا اسکریپت کد شده استفاده نمایند. این پاسخ ها موجب می شوند کلیدهایی برای بستن پنجره، پیام هایی برای نمایش به کاربران، داده های اعتبارسنجی شده و تقریباً هر نوع دیگری از پاسخ های قابل تصور، در نظر گرفته شوند.

رویدادها بخشی از Document Object Model (DOM) سطح ۳ می باشند و هر عنصر HTML شامل مجموعه ای از رویدادها می باشد، که این رویدادها می توانند کدهای جاوا اسکریپت را راه اندازی کنند.

نتیجه:

به طور ساده رویداد (Event) در جاوا اسکریپت به معنای بروز یک اتفاق هست که بعد از بروز رویداد مفسر جاوا اسکریپت آن را شناسایی میکند و در صورتی که در رویداد کد خاصی نوشته شده باشد آن را اجرا میکند …

نمونه ای از رویدادها

در این بخش میخواهیم بررسی عملی به رویداد onclick داشته باشیم …

رویداد on‌click در پاسخ به کلیک کردن بر چیزی میآید. بعنوان مثال اگر ما دکمه ای داشته باشیم میتوانیم با رویداد تعریف کنیم که پس از کلیک کردن کاربر روی دکمه چه اتفاقی بیافتد،

ما میتوانیم رویداد onclick را به صورت خطی در ترکیب html بنویسیم بعنوان مثال :

<button on‌‌‌click=”alert(‘hello’)”>click me!</button>

این روش از نظر سئو پیشنهاد نمیشود …

یا اینکه بهتر است جداگانه داخل فایل جاوااسکریپت یا در تگ جاوااسکریپت بنویسید :

<button id=”Name” on‌click=”Alireza()”>click me!</button>

//روش ۱
function Alireza(){
alert(“Hello World”);
}
//روش ۲
document.getElementById(“Name”). = function(){
alert(“Hello World”);
}

در نمونه بالا دو روش را امتحان کرده ایم. روش اول این هست که میتوانید داخل قسمت رویداد آنکلیک(onclick) در button ، نام تابع خودتان را وارد کنید و بعد از آن، آن را داخل فضای جاوااسکریپت تعریف کنید.
روش دوم این هست که کلا داخل فضای جاوااسکریپت با آی دی(id) آن را شناسایی کنید و همانجا رویداد را تعریف کنید.

همچنین دنبال کنید ویژگی و نحوه ایجاد آرایه ها در JavaScript، کلیک کنید.