Problema al insertar iframes en DIVS

Iniciado por genericobro, 6 Marzo 2015, 16:51 PM

0 Miembros y 1 Visitante están viendo este tema.

genericobro

Hola muy buenas a todos. Llevo un par de días trabado en el proyecto que estoy haciendo, he buscado información tanto en español como inglés pero no doy con una posible solución.

Os cuento: Tengo un DIV ('capa') donde voy cambiando el contenido con getElementById('capa').innerHTML. Funciona perfecto, pero cuando el contenido es un iframe, un código embebido o similares (<object> por ejemplo) me cambia el código, me lo reordena. Y necesito que no me lo cambie porque en la aplicación comparo lo que tengo originalmente con lo que hay actualmente en la 'capa'.

Os pongo un ejemplo de lo que hace:
Si tengo esto:
Código (html4strict) [Seleccionar]
<iframe width="400" height="200" src="https://www.youtube.com/embed/-3bKJZxBrMI" frameborder="0" allowfullscreen></iframe>

Me lo cambia por esto:
Código (html4strict) [Seleccionar]
<iframe src="https://www.youtube.com/embed/-3bKJZxBrMI" allowfullscreen="" frameborder="0" height="200" width="400"></iframe>

Como podeis ver, el width y el height están cambiados de sitio, así como el allowfullscreen al que se le ha añadido ="".
Quiero que no se cambie, que lo muestre tal cual.

El valor del DIV lo cambio con el siguiente código:
Código (javascript) [Seleccionar]
document.getElementById('capa').innerHTML = embed;
donde embed lo extraigo de un archivo XML que tengo de la siguiente forma:
Código (javascript) [Seleccionar]
var embed = anotaciones[cent].getElementsByTagName("embed")[0].childNodes[0].nodeValue;

¿Alguien me puede hechar un cable? ¡¡No sé cómo continuar!!!

Mod: Obligatorio el uso (correcto) de las etiquetas GeSHi

MinusFour

¿Revisaste el source de HTML una vez que haces el cambio? Los navegadores a veces modifican la estructura en memoria pero no el source en si. En tu developer tools probablemente veas el agregado pero si das click derecho sobre la pagina y le das a ver codigo fuente es probable que tu codigo aparezca como tal.

genericobro

Si si, si inspecciono el código fuente o le doy a revisar con "Inspeccionar elemento", me sale ya el código cambiado. Por eso estoy tan trabajo en este punto.
Creo que se cambia automáticamente al usar innerHTML o algo así. :(

MinusFour

Cita de: genericobro en  6 Marzo 2015, 17:39 PM
Si si, si inspecciono el código fuente o le doy a revisar con "Inspeccionar elemento", me sale ya el código cambiado. Por eso estoy tan trabajo en este punto.
Creo que se cambia automáticamente al usar innerHTML o algo así. :(

Cuando le das Inspeccionar Elemento en Chrome, estas inspecionando el codigo con los Developer Tools. ¿Has hecho click derecho sobre la pagina y darle click a ver codigo fuente?

genericobro

Si le doy a ver código fuente no puedo ver directamente el código del DIV en cuestión, ya que estoy metiendo el contenido con innerHTML dinámicamente.
Es decir, al ver el código fuente veo lo que hay inicialmente en el DIV, pero no lo que quiero meter (y lo que falla).
Un saludo, voy a hacer más pruebas a ver si encuentro alguna solución, si alguien encuentra algo que me lo diga, ¡se lo agradecería mucho!

MinusFour

Cita de: genericobro en  9 Marzo 2015, 13:37 PM
Si le doy a ver código fuente no puedo ver directamente el código del DIV en cuestión, ya que estoy metiendo el contenido con innerHTML dinámicamente.
Es decir, al ver el código fuente veo lo que hay inicialmente en el DIV, pero no lo que quiero meter (y lo que falla).
Un saludo, voy a hacer más pruebas a ver si encuentro alguna solución, si alguien encuentra algo que me lo diga, ¡se lo agradecería mucho!

Se me habia pasado el detalle que lo habias hecho con InnerHTML. ¿Hay alguna razon por la cual no quieras que te haga esos cambios?

genericobro

Si, no quiero que me haga esos cambios porque tengo un if que compara lo que hay en la capa con lo que tengo en un archivo XML. Al cambiármelo no tiene sentido el if, es decir, siempre se cumple el if...

MinusFour

Cita de: genericobro en 10 Marzo 2015, 12:28 PM
Si, no quiero que me haga esos cambios porque tengo un if que compara lo que hay en la capa con lo que tengo en un archivo XML. Al cambiármelo no tiene sentido el if, es decir, siempre se cumple el if...


Puedes guardar el string en el objeto y luego hacer simplemente la comparacion con el string y no con InnerHMTL:

Código (javascript) [Seleccionar]

var capa = document.getElementById('capa');
capa.embed = embed;
capa.innerHTML = embed;


Ahora solo haces la comparacion con capa.embed en lugar de innerHTML.