Iframes zijn HTML-elementen waarmee u externe inhoud, zoals webpagina's, kunt insluiten in een huidige pagina. In dit artikel laten we u zien hoe u met JavaScript de inhoud van twee of meer iframes kunt wijzigen met één enkele knop.

Wat is een iframe?

Een iframe is een HTML-element dat externe inhoud in een webpagina kan insluiten. U kunt het etiket gebruiken om een ​​webpagina, video, document of andere multimedia-inhoud op uw website in te sluiten. De basisstructuur van een iframe is als volgt:

Door JavaScript te gebruiken, kunt u de inhoud van iframes dynamisch wijzigen, waardoor een meer interactieve en naadloze gebruikerservaring wordt geboden.

Voorbeeld van het wijzigen van de inhoud van meerdere iframes via een knop

In het volgende voorbeeld laten we zien hoe u de inhoud van drie iframes kunt wijzigen met behulp van een enkele knop met behulp van JavaScript:

In dit voorbeeld hebben we drie iframes met id's gemaakt iframe1, iframe2 En iframe3 dat inbedden pagina1.html, pagina2.html En pagina3.html respectievelijk. Vervolgens hebben we een knop gemaakt die, wanneer erop wordt geklikt, de functie uitvoert veranderinhoud(). Deze functie gebruikt getElementById() om elk iframe te selecteren en het kenmerk ervan te wijzigen src naar de nieuwe pagina's nieuwe_pagina1.html, nieuwe_pagina2.html En nieuwe_pagina2.html.