בלוג זה יסביר כיצד לשנות את מקור ה-iframe ב-JavaScript.
מהי מסגרת מוטבעת?
' מסגרת מוטבעת ' משמש להכיל מסמך שצוין אחר בתוך המסמך הנוכחי. זה גורם להחלפת דפי האינטרנט על סמך הקישורים המצוינים.
כיצד לשנות את מקור ה-Iframe ב-JavaScript?
ניתן לשנות את מקור ה-Iframe ב-JavaScript באמצעות הגישות הבאות יחד עם ' getElementById() ' שיטה:
- ' פרמטר עבר 'טכניקה.
- ' אינדקס נבחר ' תכונה.
גישה 1: שנה את מקור ה-Iframe ב-JavaScript באמצעות טכניקת פרמטרים שעברה
ניתן להשתמש בטכניקה זו כדי לעבור לדף שצוין על ידי הצבת קישור הדף המתאים כפרמטר של פונקציה כאשר הגישה אליו היא בעזרת כפתור.
דוגמא
בוא נלך בעקבות הדוגמה המפורטת להלן:
< מֶרְכָּז >< h2 > שנה את מקור ה-iframe ב JavaScript h2 >
< מזהה iframe = 'עמוד אינטרנט' src = 'https://linuxhint.com/detect-tab-key-javascript/' רוֹחַב = '1000' גוֹבַה = '550' גבול המסגרת = '0' גְלִילָה = 'לא' > iframe >
< br >< br >
< כפתור בלחיצה = 'changeIframe('https://linuxhint.com/category/linux-commands/')' > לחץ כדי להציג את דף הפקודות של לינוקס לַחְצָן >
< br > br >
מֶרְכָּז >
בשורות הקוד לעיל, בצע את השלבים הבאים:
- ציין את הקישור המוצהר ב' <מסגרת מוטבעת> ' תג יחד עם המידות המותאמות.
- כמו כן, צור כפתור עם ' בלחיצה אירוע מפנה מחדש לפונקציה changeIframe() עם הקישור שצוין כפרמטר שלה.
- זה יגרום להפניית הדף לקישור הנקוב בלחיצה על הכפתור.
בואו נמשיך לחלק JavaScript של הקוד:
< סוג סקריפט = 'טקסט/Javascript' >
פוּנקצִיָה changeIframe ( שינוי ) {
מסמך. getElementById ( 'עמוד אינטרנט' ) . src = שינוי ;
}
תַסרִיט >
בקטע הקוד שלמעלה:
- הכריז על פונקציה בשם ' changeIframe() '.
- בהגדרתו, גש לקישור שצוין ב-' מסגרת מוטבעת ' רכיב באמצעות ' document.getElementById() ' שיטה.
- לאחר מכן, החל את ' src ' מייחסים ומקצים את הקישור האמור עם גישה של הפונקציה לקישור שנגיש באמצעות הפרמטר ' שינוי '.
- זה יגרום להחלפת הדפים ביחס לקישורים שצוינו בלחיצת הכפתור.
תְפוּקָה
בפלט לעיל, ניתן לראות שהדפים עוברים בלחיצה על הכפתור.
גישה 2: שנה את מקור ה-Iframe ב-JavaScript באמצעות מאפיין selectIndex
ה ' אינדקס נבחר ' מאפיין מחזיר את האינדקס של האפשרות שנבחרה ברשימה נפתחת. ניתן להחיל מאפיין זה כדי להפנות מחדש לקישור שצוין ביחס לערך של האפשרות שנבחרה מהרשימה הנפתחת.
דוגמא
בואו נסתכל על הדוגמה הבאה:
< מזהה iframe = 'עמוד אינטרנט' src = 'https://linuxhint.com/detect-tab-key-javascript/' רוֹחַב = '1000' גוֹבַה = '550' גבול המסגרת = '0' גְלִילָה = 'לא' > iframe >
< br >< br >
< בחר מזהה = 'קישורים' >
< ערך אופציה = 'https://linuxhint.com/auto-refresh-web-page-every-5-seconds-javascript/' > עבור למאמר 1
< ערך אופציה = 'https://linuxhint.com/convert-array-to-object-javascript/' > עבור למאמר שתיים
בחר >
< br >< br >
< כפתור בלחיצה = 'changeIframe();' > שנה Iframe Src לַחְצָן >
< br >< br >
גוּף > מֶרְכָּז >
בשורות הקוד לעיל, בצע את השלבים הבאים:
- זכור את השלב לציון הקישור המוצהר בתוך '