Iframe yra HTML elementai, leidžiantys į dabartinį puslapį įterpti išorinį turinį, pvz., tinklalapius. Šiame straipsnyje parodysime, kaip pakeisti dviejų ar daugiau „iframe“ turinį vienu mygtuku naudojant „JavaScript“.

Kas yra iframe?

Iframe yra HTML elementas, galintis įterpti išorinį turinį į tinklalapį. Galite naudoti etiketę norėdami į savo svetainę įterpti tinklalapį, vaizdo įrašą, dokumentą ar kitą daugialypės terpės turinį. Pagrindinė iframe struktūra yra tokia:

Naudodami „JavaScript“ galite dinamiškai modifikuoti „iframe“ turinį, kad naudotojas būtų interaktyvesnis ir sklandesnis.

Pavyzdys, kaip vienu mygtuku pakeisti kelių „iframe“ turinį

Šiame pavyzdyje parodome, kaip pakeisti trijų „iframe“ turinį vienu mygtuku naudojant „JavaScript“.

function changeContent() {
document.getElementById("iframe1").src = "new_page1.html";
document.getElementById("iframe2").src = "new_page2.html";

Šiame pavyzdyje sukūrėme tris „iframe“ su ID iframe1, iframe2 ir iframe3 kad įterpti puslapis1.html, page2.html ir page3.html atitinkamai. Tada sukūrėme mygtuką, kurį paspaudus vykdoma funkcija changeContent(). Ši funkcija naudoja getElementById() norėdami pasirinkti kiekvieną iframe ir pakeisti jo atributą src į naujus puslapius naujas_puslapis1.html, naujas_puslapis2.html ir naujas_puslapis2.html.