إطارات Iframes هي عناصر HTML تسمح لك بتضمين محتوى خارجي ، مثل صفحات الويب ، داخل الصفحة الحالية. نوضح لك في هذه المقالة كيفية تغيير محتوى إطارين أو أكثر من إطارات iframe باستخدام زر واحد باستخدام JavaScript.

ما هو إطار iframe؟

iframe هو عنصر HTML يمكنه تضمين محتوى خارجي في صفحة ويب. يمكنك استخدام التسمية لتضمين صفحة ويب أو مقطع فيديو أو مستند أو محتوى وسائط متعددة آخر على موقع الويب الخاص بك. الهيكل الأساسي لإطار iframe هو كما يلي:

باستخدام JavaScript ، يمكنك تعديل محتوى إطارات iframe ديناميكيًا ، مما يوفر تجربة مستخدم أكثر تفاعلية وسلسة.

مثال على كيفية تغيير محتوى إطارات مضمنة متعددة من زر

في المثال التالي نوضح كيفية تغيير محتوى ثلاثة إطارات iframe باستخدام زر واحد باستخدام JavaScript:

تغيير الوظيفة المحتوى () { code>
document.getElementById ("iframe1"). src = "new_page1.html" ؛
document.getElementById ("iframe2"). src = "new_page2.html" ؛

في هذا المثال ، أنشأنا ثلاثة إطارات مضمنة بمعرفات iframe1, iframe2 و iframe3 هذا التضمين page1.html, page2.html و page3.html على التوالى. بعد ذلك ، أنشأنا زرًا ، عند النقر عليه ، يقوم بتنفيذ الوظيفة changeContent (). تستخدم هذه الوظيفة getElementById () لتحديد كل إطار iframe وتغيير السمة الخاصة به src إلى الصفحات الجديدة new_page1.html, new_page2.html و new_page2.html.