cargar un html dentro de otro sin <FRAME> NI <IFRAME>

manumag · #1 (**permalink**) 02/01/2007, 07:19

Hola. Soy nuevo en este foro.

Antes de nada quiero enviar un saludo a todos y desearos un feliz año.

Mi problema es que no soy muy amigo de los frames. Necesito cargar un html dentro de otro sin tener que utilizar estas etiquetas. A mi me suena que, si es que se puede hacer, se haría con javascript, por eso hago mi pregunta en este apartado, pero si hay alguna otra forma de hacerlo me alegraría de igual manera poder saberla.

Alguien me puede ayudar?

Gracias de antemano y saludos.

bookmaster · #2 (**permalink**) 02/01/2007, 15:27

Hola, lo que comentas de hacer sería mas sencillo haciendolo con un lenguaje de programación del lado del servidor, comno puedan ser PHP y ASP de todas maneras, en Javascript hay una manera de hacerlo que actualmente se conoce como AJAX, demomento no conozco mucho de ello, pero te puedo poner un sencillo ejemplo de como funciona.

Código HTML:

<HTML>
<HEAD>
<TITLE>Prueba</TITLE>
<SCRIPT language="Javascript">
<!--
function muestra(){
document.getElementById("Prueba").innerHTML="Esto es una prueba de que se cambia al pulsar sobre el enlace";

};

-->
</SCRIPT>
</HEAD>
<BODY>
<TABLE border="1">
<TR><TD><B><U>Esto no se cambia:</U></B></TD></TR>
<TR>
<TD><DIV ID="Prueba" onclick="muestra();">
Este texto es el normal y al pulsar encima de el se cambia.
</DIV>

</TD>
</TR>

</TABLE>

</BODY>
</HTML>

Fijate en que la etiqueta <DIV> le he puesto un nombre con ID y que en el Javascript hacemos la llamada a ese nombre y le indicamos lo que queremos mostrar.

Siento no poder ayudarte mucho con el tema del AJAX pero esto que te he puesto de ejemplo es la idea del funcionamiento.

cards · #3 (**permalink**) 02/01/2007, 19:15

Bookmaster, bien por ayudar..... pero eso no es ajax :P
Eso es simple javascript puro y duro. Los efectos, son eso, simples efectos generados con javascript.
Y el que la mayoria de sitios utilizen tales efectos no signica que eso sea ajax ;)

Ajax consiste en usar javascript para mantener una conexion asincrona con el servidor (usando normalmente el objeto XMLHttpRequest). Vamos, que se usa para obtener o mandar informacion al servidor en un momento concreto.

Y que yo vea no as echo ninguna llamada al servidor, simplemente has echo que un texto cambie por otro, simple javascript.

Simple aclaracion para no confundir a manumag de lo k és ajax ^^

manumag · #4 (**permalink**) 03/01/2007, 07:13

He estado buscando desesperadamente la forma de hacerlo y me encontré con algo muy interesante (Esto es exactamente lo que quiero hacer) en esta página:

aplus.co.yu/web-dev/insert-html-page-into-another-html-page

Por lo visto, los FRAME y los IFRAME se pueden sustituir con la etiqueta <OBJECT> haciendo la misma función.

Tenemos dos páginas: main.html y second.html.
En la primera, en la cual vamos a cargar second.html, introducimos el siguiente código dentro del HEAD:




<object type="text/html" data="second.html">
<p>backup content</p>
</object>


Esto está perfecto si utilizamos por ejemplo Firefox, pero claro (y para no variar), si lo hacemos con el dichoso Explorer, claro está, la cosa cambia.
Con el navegador de Bill Gates nos aparecerá una especie de borde-escalón que no se sabe muy bien si es un borde o un escalón y que no consigo eliminar ni con ácido.

Según la web donde he encontrado la forma, añadiendo lo siguiente en el body de la página que será alojada, es decir "second.html":

....
<body style="border:0;overflow:visible">
....

esto quedará solventado.

Pues por mucho que lo he intentado, no logro que esto funcione. Con esto sigue saliendo el scroll y el borde.

Bien; el scroll no es problema. Al BODY de "second.html" le añadimos SCROLL="NO" y queda solucionado. Lo malo es el borde. Toda la mañana investigando me ha servido al menos para dudar de que esto sea un borde por que como dije antes, no lo elimino ni poniendo mil veces que no quiero que salga el borde. Es algo extraño. Una especie de escalón extrañísimo. De hecho, si pongo por ejemplo...border: 5px solid Red... lo que me aparece es un borde de 5 píxeles rojo alrededor del escalón.

En fín, ahí está ahora mi duda y mi problema por si alguién puede dar un poco de luz a esto. De todas formas me pareció interesante comentar esta forma de insertar un HTML dentro de otro porque de alguna manera puede ser útil a otros.

Saludos y gracias por las respuestas.

bookmaster · #5 (**permalink**) 03/01/2007, 10:18

Cita:

Iniciado por cards

Bookmaster, bien por ayudar..... pero eso no es ajax :P
Eso es simple javascript puro y duro. Los efectos, son eso, simples efectos generados con javascript.
Y el que la mayoria de sitios utilizen tales efectos no signica que eso sea ajax ;)

Ajax consiste en usar javascript para mantener una conexion asincrona con el servidor (usando normalmente el objeto XMLHttpRequest). Vamos, que se usa para obtener o mandar informacion al servidor en un momento concreto.

Y que yo vea no as echo ninguna llamada al servidor, simplemente has echo que un texto cambie por otro, simple javascript.

Simple aclaracion para no confundir a manumag de lo k és ajax ^^

Se de sobra lo que es el AJAX, solo he indicado que el funcionamiento base del AJAX es mostrar el contenido que se carga de otra página transformada a XML automaticamente, salga dentro de los <DIV>. El script que puse de ejemplo muestra el "contenido" que saldría en los <DIV>, ni mas ni menos.

yoju · #6 (**permalink**) 03/04/2007, 00:23

Pero señores...
complicadamente he visto como funciona el ajax, pero para mí siempre ha sido más fácil utilizar un iframe con un id y un div con un id donde quiero que se carguen los datos.
Es sencillo:
Si queremos buscar en nuestra base de datos sin que se den cuenta, ni que la página refresque, solamente tenemos que enviar los datos al iframe creado y dentro del mismo devolver, por método javascript, los valores que necesitemos.
Como yo puedo hacer lo que desee en ese iframe podré devolver, no solo un texto, sino toda una serie de código y nadie se daría cuenta de nada.
Yo lo he usado así toda mi vida, así mi página nunca refresca, más bien, cuando está realizando una operación el iframe, mi página va diciendo en una imagen "Espere..."
Sencillo, económico y sin tener que saber Ajax, no considero que ajax sea malo, pero considero que el método iframe(funciona en IE y Firefox) es más fácil.
Siempre usando: document.getElementById ó ByName y los llamados innerText e innerHTML... Sencillo
NOTA: EL IFRAME TIENE DE BORDER 0 NADIE LO VE... Es la mejor manera no sé porqué buscar otra como dice el título.

adescalz · #7 (**permalink**) 05/05/2008, 08:20

manumag, en esta pagina podes ver como solucionaron el problema del borde de la pagina

www.mmcdesign.com/blog/2006/12/21/usando-elementos-object-en-vez-de-iframes/

JavierB · #8 (**permalink**) 05/05/2008, 09:15

El mensaje original es de hace más de un año. Por favor, no reviváis temas tan antiguos.

Saludos,