Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

240
Vistas
No se puede crear un div dentro de iframe

Tengo un iframe y quiero agregarle un div usando JavaScript. Pero no aparece. ¿Qué estoy haciendo mal?

 <html> <body> <iframe id="zzz" srcdoc="<html><h1>hello</h1><button>click </button> <button>btn 2</button></html>" width="500" height="500"> </iframe> <script> let myiframe = document.getElementById("zzz").contentWindow.document; let mydiv = myiframe.createElement("div"); mydiv.style.background = "red"; mydiv.style.width = "300px"; myiframe.body.appendChild(mydiv); </script> </body> </html>

Estoy ejecutando esto en mi servidor local usando la extensión de servidor en vivo VSCode y también lo ejecuté en el editor de prueba de w3schools:

ingrese la descripción de la imagen aquí

¡Mira, no hay div rojo aquí!

Edición 1:

Bien, también verifiqué el DOM. Todavía nada aquí...

ingrese la descripción de la imagen aquí

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

A Chrome le gusta un evento de carga; también podemos usar document.getElementById("zzz").contentDocument;

https://jsfiddle.net/mplungjan/ju8t6xoq/

Stacksnippets no permitirá acceder al iFrame

 window.addEventListener("load", function() { let myiframeDocument = document.getElementById("zzz").contentDocument; let mydiv = myiframeDocument.createElement("div"); mydiv.style.background = "red"; mydiv.style.width = "300px"; mydiv.style.height = "300px"; mydiv.textContent = 'bla' myiframeDocument.body.appendChild(mydiv); });
about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda