InicioHazlo Tu MismoCrear un elemento DIV que no existe en tu pagina (HTML)

Crear un elemento DIV que no existe en tu pagina (HTML)

Hazlo Tu Mismo1/17/2014
Hola espero que esto te pueda servir.

Me ha costado 3 días de intensa busqueda sin nada de concreto, pero dicen (percevera y triunfaras). Sin más protocolo aquí esta mi dolor de cabeza de esta semana.

Yo tengo un Div creado con anticipación y quería crear (internamente) otros div(s) con imágenes, pero núnca iba a saber cuantas imágenes iba a cargar (1, 5, 20, 50 o 1000) entonces debía crear tantos Div(s) como fuera necesario - Aquí el problema -

Como es lógico TODOS apuntan a jQuery, CSS pero nada en concreto... Hasta que junté todo lo leido y saque esto. Espero que te sirva...


<!DOCTYPE html>
<html lang='es'>

<!--
Comentarios acerca de este programa:
Este programa permite crear dentro de un <Div> tantos otros <Div(s)> como quiera (que no existen)
-->

<html>

<head>
<title>Extension Visual</title>
<meta http-equiv="Content-Type" content="text/html; charset='iso-8859-1">
<script type="text/javascript" src="file:///C:/horse/jquery-1.10.2.min.js"></script>
</head>

<body>
<style>
/* Barra Horizontal de Corrimiento */
.barra-panel {overflow:auto; position:absolute; left:10px; top:40%; width:98.5%; right:20; height:140px; z-index:1; }
.borde-Panel {border: 1px solid RGB(0,0,0); background: RGB(215,201,168); }
.punta-Izq {border-top-left-radius: 5px;}
.punta-Der {border-top-right-radius: 5px;}
.cadena{width:300px;}
.tipo{width:150px; height:25px;}
</style>

<div class="barra-panel borde-Panel punta-Izq punta-Der" id="lista">Este Div de color marron esta escrito en el HTML</div>

<input class="cadena" type="text" id="texto" value="Este es un nuevo div 1"/>
<input class="tipo" type="button" value="Crear Nuevo DIV" onclick=nuevo(); />
</body>

<script type="text/javascript">
var cuenta = 1;

function nuevo() {
// Obtenemos el valor entrado en la caja de texto
var valor = document.getElementById( "texto" ).value;

// Creamos un nuevo elemento DIV
var divx = document.createElement( "div" );

// Añadimos el valor introducido al nuevo elemento
divx.innerHTML = valor;

// Añadimos el elemento DIV al DIV existente
var div = document.getElementById( "lista" );
div.appendChild(divx);

// Vaciamos la caja de texto
cuenta = cuenta+1;
document.getElementById( "texto" ).value = "Este es un nuevo div "+cuenta;

}
</script>


</html>



Como es lógico era mucho más chico, pero comencé a "jugar" y le fui agregando cada vez más pabadas para ver si estoy aprendiendo algo de todo este tiempo que estoy perdiendo.

Te deseo lo mejor!!!
Datos archivados del Taringa! original
0puntos
0visitas
0comentarios
Actividad nueva en Posteamelo
0puntos
1visitas
0comentarios
Dar puntos:

Dejá tu comentario

0/2000

Autor del Post

H
Humberto02🇦🇷
Usuario
Puntos0
Posts15
Ver perfil →
PosteameloArchivo Histórico de Taringa! (2004-2017). Preservando la inteligencia colectiva de la internet hispanohablante.

CONTACTO

18 de Septiembre 455, Casilla 52

Chillán, Región de Ñuble, Chile

Solo correo postal

© 2026 Posteamelo.com. No afiliado con Taringa! ni sus sucesores.

Contenido preservado con fines históricos y culturales.