מאמר זה מדגים בקצרה מהי שיטת ה-DOM Element 'click()' וכיצד להשתמש בה ב-HTML?
מהי שיטת ה-DOM Element 'click()' ב-HTML?
כאשר מתודה click() נקראת על אלמנט HTML, היא מדמה משתמש לוחץ על האלמנט עם העכבר, אשר בתורו מפעיל את כל מטפלי האירועים המצורפים. זה מאפשר למפתחים לבצע מספר פעולות אינטראקטיביות כמו פתיחת קישורים, שליחת טפסים או החלפת נראות של אלמנטים ללא צורך בלחיצת עכבר פיזית. זה עוזר ליצור דפי אינטרנט אינטראקטיביים ורספונסיביים.
כיצד להשתמש בשיטת רכיב ה-DOM 'click()' ב-HTML?
כדי להשתמש בשיטת click() המשתמשים צריכים קודם כל להשיג הפניה לרכיב ה-HTML כדי לדמות לחיצה. ניתן לעשות זאת באמצעות כל אחת משיטות המעבר או השאילתה הסטנדרטיות של DOM, כגון ' getElementById ', ' getElementsByClassName ', ' querySelector ', או ' querySelectorAll '.
הבה נעבור על דוגמה להסבר טוב יותר של שיטת 'click()'.
דוגמה: תיבת סימון HTML ורכיבי לחצן בחירה
נשקלת דוגמה שבה ' נְקִישָׁה() שיטת ' מנוצלת עם תיבת הסימון HTML ורכיבי לחצן הבחירה. עקוב אחר הקוד הבא:
< טופס >
< קֶלֶט
סוּג = 'תיבת סימון'
תְעוּדַת זֶהוּת = 'תיבת סימון1'
מעבר עכבר = 'forCheckbox()'
>
מופעל על ידי Linuxhint
< קֶלֶט
סוּג = 'רָדִיוֹ'
תְעוּדַת זֶהוּת = 'כפתור רדיו'
מעבר עכבר = 'forRadio()'
>
מופעל על ידי Linuxhint
< / טופס >
בקטע הקוד שלמעלה:
- ראשית, תיבת סימון נוצרת בדף האינטרנט על ידי שימוש בתג עם הסוג שהוגדר ל' תיבת סימון '.
- לאחר מכן, מאזין האירוע ' מעבר עכבר ' מצורף לתיבת הסימון ומפעיל את ' forCheckbox() ' פונקציה.
- באותו אופן, ה' רָדִיוֹ הלחצן נוצר באמצעות הלחצן ' <קלט> ” תג, והמאזין לאירוע מצורף אליו. אבל הפעם, ה' forRadio() ' מופעלת הפונקציה.
לאחר יצירת אלמנט HTML בדף האינטרנט, הגיע הזמן להוסיף את ה-' נְקִישָׁה() ' שיטה:
< תַסרִיט >
פונקציה עבורCheckbox ( ) {
document.getElementById ( 'תיבת סימון1' ) .נְקִישָׁה ( ) ;
}
פונקציה עבור רדיו ( ) {
document.getElementById ( 'כפתור רדיו' ) .נְקִישָׁה ( ) ;
}
< / תַסרִיט >
בקטע הקוד שלמעלה:
- ראשית, הגדר שתי פונקציות JavaScript, ' forCheckbox() ' ו' forRadio() '.
- פונקציות אלה משתמשות ב' document.getElementById() ' שיטה להשגת הפניות לרכיבי HTML בדף עם מזהים ספציפיים 'checkbox1' ו-'radioButton'.
- לסימולציה של לחיצה על אלמנט ה-HTML, נעשה שימוש בשיטת click(). פונקציה זו מחליפה את המצב של מופעל או כבוי כאשר היא נקראת.
לאחר ביצוע קטעי הקוד לעיל, הפלט מופיע כך:
ה-GIF שלמעלה ממחיש שהסטטוס של תיבת הסימון וכפתור הבחירה משתנה באמצעות שיטת 'click()'.
סיכום
שיטת click() שימושית במיוחד לטיפול באינטראקציות של משתמשים עם דף אינטרנט באמצעות JavaScript.
במקום לסמוך על המשתמש שילחץ פיזית על האלמנט, השתמש בשיטת click() כדי לדמות את אירוע הקליק באופן פרוגרמטי. זה שימושי ליצירת עיצובים אינטראקטיביים וידידותיים למשתמש. מאמר זה הדגים בהצלחה את המשמעות של רכיב ה-DOM 'click()' ב-HTML.