Aquest bloc explicarà com canviar la font d'iframe en JavaScript.
Què és un marc en línia?
Un ' marc en línia ” s'utilitza per contenir un altre document especificat dins del document actual. Això fa que canviï les pàgines web en funció dels enllaços indicats.
Com canviar la font d'iframe a JavaScript?
La font d'iframe es pot canviar a JavaScript mitjançant els enfocaments següents juntament amb el ' getElementById() ” mètode:
- “ Paràmetre passat ” Tècnica.
- “ índex seleccionat ' Propietat.
Enfocament 1: Canvieu la font d'Iframe a JavaScript mitjançant la tècnica de paràmetres passats
Aquesta tècnica es pot utilitzar per canviar a la pàgina especificada col·locant l'enllaç de la pàgina corresponent com a paràmetre d'una funció quan s'hi accedeix amb l'ajuda d'un botó.
Exemple
Seguim l'exemple que s'indica a continuació:
< centre >< h2 > Canvia l'origen de l'iframe en JavaScript h2 >
< identificador d'iframe = 'pàgina web' src = 'https://linuxhint.com/detect-tab-key-javascript/' amplada = '1000' alçada = '550' vora del marc = '0' desplaçament = 'no' > iframe >
< br >< br >
< botó al fer clic = 'changeIframe('https://linuxhint.com/category/linux-commands/')' > Feu clic per mostrar la pàgina d'ordres de Linux botó >
< br > br >
centre >
A les línies de codi anteriors, realitzeu els passos següents:
- Especifiqueu l'enllaç indicat al '
” juntament amb les dimensions ajustades. - A més, creeu un botó amb un adjunt ' fent clic ” esdeveniment que redirigeix a la funció changeIframe() amb l'enllaç especificat com a paràmetre.
- Això donarà lloc a la direcció de la pàgina a l'enllaç indicat en fer clic al botó.
Continuem amb la part JavaScript del codi:
< tipus de guió = 'text/javascript' >
funció canviarIframe ( canvi ) {
document. getElementById ( 'pàgina web' ) . src = canvi ;
}
guió >
Al fragment de codi anterior:
- Declarar una funció anomenada ' canviarIframe() ”.
- En la seva definició, accediu a l'enllaç especificat a la ' marc en línia ' amb l'element ' document.getElementById() ” mètode.
- Després d'això, apliqueu el ' src ” atribueix i assigna l'enllaç indicat quan la funció accedeixi a l'enllaç accedit mitjançant el paràmetre “ canvi ”.
- Això donarà lloc a canviar les pàgines pel que fa als enllaços especificats en fer clic al botó.
Sortida
A la sortida anterior, es pot observar que les pàgines es canvien en fer clic al botó.
Enfocament 2: Canvieu la font d'iframe a JavaScript mitjançant la propietat selectedIndex
El ' índex seleccionat ” La propietat retorna l'índex de l'opció seleccionada en una llista desplegable. Aquesta propietat es pot aplicar per redirigir a l'enllaç especificat pel que fa al valor de l'opció seleccionada de la llista desplegable.
Exemple
Observem el següent exemple:
< identificador d'iframe = 'pàgina web' src = 'https://linuxhint.com/detect-tab-key-javascript/' amplada = '1000' alçada = '550' vora del marc = '0' desplaçament = 'no' > iframe >
< br >< br >
< seleccioneu id = 'enllaços' >
< valor de l'opció = 'https://linuxhint.com/auto-refresh-web-page-every-5-seconds-javascript/' > Canvia a l'article 1
< valor de l'opció = 'https://linuxhint.com/convert-array-to-object-javascript/' > Canvia a l'article 2
seleccionar >
< br >< br >
< botó onCliqueu = 'canviarIframe();' > Canvia Iframe Sr botó >
< br >< br >
cos > centre >
A les línies de codi anteriors, realitzeu els passos següents:
- Recordeu el pas per especificar l'enllaç indicat dins del '