un marco en línea o iFrame , es un marco dentro de una página Web que puede contener un objeto externo, como otra página Web. El atributo iFrame "src " especifica la página Web que se cargue en el marco. A menudo es el caso de que usted desea que el contenido iFrame a variar en función de la lógica del programa , un evento o algún otro criterio en tiempo de ejecución . Usted puede cambiar el contenido del iFrame modificando su atributo "src " . Instrucciones
1
Crear un nuevo archivo HTML con un editor HTMlL o el Bloc de notas. Introduzca las cabeceras HTML para el archivo. ! Por ejemplo , escriba:
< DOCTYPE HTML PUBLIC " - //W3C //DTD XHTML 1.0 Transitional //EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1 - transitional.dtd ">
< p >
marco < /title> <br> 2 <p> Definir una función de JavaScript para cambiar el atributo "src " del iFrame con el fin de cambiar su contenido . Por ejemplo , escriba: <br> <p> <script type="text/javascript"> <br> changeContents <p> función () { var <br> <p> frame = document.getEelemtnById ( " MyFrame " ) ; <br> <p> if ( frame.src = " this.html " ) <br> <p> frame.src = " that.html " ; <br> <p> más <br> marco <p> . src = " this.html " ; <br> <p> <br> <p> } < /script > <br> <p> < /head> <br> 3 <p > Crear un botón HTML dentro de las etiquetas "body" que llama a la función JavaScript para cambiar el contenido iFrame cuando se hace clic . Por ejemplo , escriba: <br> <p> <body> <br> <p> <form> <input type="button" value="Change" onclick="changeContents()" /> < /form> <br> 4 <p> Inserte el iFrame en la página web. Por ejemplo , escriba: <br> <p> <iframe id="myFrame" src="this.html" width="300" height="300"> < /iframe > <br> <p> < ;/body> <br> <p> < /html> <br> 5 <p> Guarde el archivo y tire hacia arriba de la página web en un navegador. Pon a prueba para asegurarse de que el script funciona correctamente. <br> <br>
<div class="escomad2"><script language='javascript' src='http://www.ordenador.online/ad/es/2.js'></script></div>
</div>
<div class=contentpage>
<div class=p1>Página anterior: <a class='LinkPrevArticle' href='http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-comprobar-el-espacio-en-blanco-para-con-Javascript-.html' >Cómo comprobar el espacio en blanco para con Javascript </a> </div>
<div class=p2>Página siguiente: <a class='LinkNextArticle' href='http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-cambiar-el-color-de-fondo-de-una-fila-en-JavaScript-.html' >Cómo cambiar el color de fondo de una fila en JavaScript </a> </div>
</div>
<dl class=xgc>
<dt><span>JavaScript Programación</span></dt>
<dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-utilizar-el-API-de-Google-Maps-para-autocompletar-campos-de-ubicación-.html">Cómo utilizar el API de Google Maps para autocompletar campos de ubicación </a></dd><dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-actualizar-las-variables-de-sesión-.html">Cómo actualizar las variables de sesión </a></dd><dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-quitar-el-último-hijo-de-una-Div-jQuery-.html">Cómo quitar el último hijo de una Div jQuery </a></dd><dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-utilizar-una-cadena-en-VBScript-.html">Cómo utilizar una cadena en VBScript </a></dd><dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-leer-iFrame-contenido-en-JavaScript-.html">Cómo leer iFrame contenido en JavaScript </a></dd><dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-cambiar-el-campo-de-la-forma-valor-con-JavaScript-.html">Cómo cambiar el campo de la forma valor con JavaScript </a></dd><dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-cambiar-el-color-de-fondo-HTML-Con-un-sistema-en-Javascript-.html">Cómo cambiar el color de fondo HTML Con un sistema en Javascript </a></dd><dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-obtener-las-compensaciones-de-desplazamiento-en-JavaScript-.html">Cómo obtener las compensaciones de desplazamiento en JavaScript </a></dd>
</dl>
</div>
<!--right-->
<div class=rightmain>
<div class=esrightlist>
<div class=e1>Los últimos artículos de equipo</div>
<ul>
<li><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-modificar-una-URL-de-una-página-con-JavaScript-.html" >Cómo modificar una URL de una página con JavaScript </a> </li><li><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-abrir-archivos-de-JavaScript-.html" >Cómo abrir archivos de JavaScript </a> </li><li><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-ocultar-la-barra-de-direcciones-de-JavaScript-.html" >Cómo ocultar la barra de direcciones de JavaScript </a> </li><li><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-comparar-los-objetos-de-fecha-en-JavaScript-.html" >Cómo comparar los objetos de fecha en JavaScript </a> </li><li><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-deshabilitar-la-pantalla-de-impresión-JavaScript-.html" >Cómo deshabilitar la pantalla de impresión JavaScript </a> </li><li><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-hacer-JavaScripts-.html" >Cómo hacer JavaScripts </a> </li>
</ul>
</div>
<div class=esrightlist>
<div class=e1>Artículos de la popular computadora</div>
<ul>
<li> <a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-usar-JavaScript-para-crear-un-Prime-Factor-Número-.html" >Cómo usar JavaScript para crear un Prime Factor Número </a></li><li> <a href="http://www.ordenador.online/Programacion/JavaScript-Programación/JavaScript-como-un-código-de-servidor-para-Apache-.html" >JavaScript como un código de servidor para Apache </a></li><li> <a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-ejecutar-código-JavaScript-en-una-página-Web-.html" >Cómo ejecutar código JavaScript en una página Web </a></li><li> <a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Nivel-Intermedio-Tutorial-Javascript-.html" >Nivel Intermedio Tutorial Javascript </a></li><li> <a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-devolver-Funciones-adicionales-para-múltiples-números-de-JavaScript-.html" >Cómo devolver Funciones adicionales para múltiples números de JavaScript </a></li><li> <a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-comprobar-el-tipo-de-explorador-de-JavaScript-.html" >Cómo comprobar el tipo de explorador de JavaScript </a></li>
</ul>
</div>
<div class="esrightad">
<script language='javascript' src='http://www.ordenador.online/ad/es/r.js'></script>
</div>
<div class=esrightlist>
<div class=e1>Más categorías</div>
<ul>
<li><a href='http://www.ordenador.online/Programacion/C--C-----Programming/' target="_self">C /C + + Programming</a></li>
<li><a href='http://www.ordenador.online/Programacion/Lenguajes-De-Programación/' target="_self">Lenguajes De Programación</a></li>
<li><a href='http://www.ordenador.online/Programacion/Delphi-Programación/' target="_self">Delphi Programación</a></li>
<li><a href='http://www.ordenador.online/Programacion/Programación-Java/' target="_self">Programación Java</a></li>
<li><a href='http://www.ordenador.online/Programacion/JavaScript-Programación/' target="_self">JavaScript Programación</a></li>
<li><a href='http://www.ordenador.online/Programacion/Programación-PHP--MySQL/' target="_self">Programación PHP /MySQL</a></li>
<li><a href='http://www.ordenador.online/Programacion/Perl-Programming/' target="_self">Perl Programming</a></li>
<li><a href='http://www.ordenador.online/Programacion/Python-Programming/' target="_self">Python Programming</a></li>
<li><a href='http://www.ordenador.online/Programacion/Rubí-Programación/' target="_self">Rubí Programación</a></li>
<li><a href='http://www.ordenador.online/Programacion/Visual-Basics-Programación/' target="_self">Visual Basics Programación</a></li>
</ul>
</div>
</div>
<!--right end-->
<div class="cl"></div>
</div>
<div class=esfoot>
<div class=copy>Conocimientos Informáticos © http://www.ordenador.online</div>
</div>
</body>
</html> 