Crear DIV con elementos

sebacibertico · #1 (**permalink**) 14/08/2010, 14:44

Hola a todos.

Mi problema es el siguiente:
Tengo la siguiente página de prueba

Código HTML:

Ver original<html>
    <head>
        <title>
            P&aacute;gina de prueba
        </title>
    </head>
    <body>
        <div id="divTest"></div>
        <a href="#" onClick="agregarCampos()"; value="Agregar">Agregar</a>
    </body>
</html>

Lo que quiero hacer, es que al apretar en el lik "Agregar" se me genere dentro del div que tengo con Id="divTest" lo siguiente:

Código HTML:

Ver original<html>
    <head>
        <title>
            P&aacute;gina de prueba
        </title>
    </head>
    <body>
        <div id="divTest">
                      <div class="otroDiv">
                         <input type="text" name="inputTest"></input>
                       </div>
                </div>
        <a href="#" onClick="agregarCampos()"; value="Agregar">Agregar</a>
    </body>
</html>

En síntesis, es crear un div con un input dentro del otro div que tengo...

Me ayudan?

Gracias

Adler · #2 (**permalink**) 14/08/2010, 14:55

Hola

Puedes usar las funciones createElement y appendChild para crear ese nuevo elemento

Suerte

sebacibertico · #3 (**permalink**) 14/08/2010, 14:57

Sip. Las uso...

Tengo esto, pero me crea el div, lo cierra, y a continuacion me crea el input. Yo quiero que el input lo haga dentro del nuevo div que se crea.

Código HTML:

Ver originalfunction agregarCampos()
            {
                //alert('test');
                newDiv = document.createElement('div');
                document.getElementById('divTest').appendChild(newDiv);
                newInput = document.createElement('input');
                newInput.type = 'file';
                document.getElementById('divTest').appendChild(newInput);
            }

Adler · #4 (**permalink**) 14/08/2010, 15:17

Hola

Prueba así

Código Javascript:

Ver originalnewDiv = document.createElement("div");
newInput = document.createElement("input");
newInput.setAttribute("type", "file");
newDiv.appendChild(newInput);
document.getElementById('divTest')..appendChild(newDiv);

Suerte

sebacibertico · #5 (**permalink**) 16/08/2010, 09:14

Cita:

Iniciado por Adler

Hola

Prueba así

Código Javascript:

Ver originalnewDiv = document.createElement("div");
newInput = document.createElement("input");
newInput.setAttribute("type", "file");
newDiv.appendChild(newInput);
document.getElementById('divTest')..appendChild(newDiv);

Suerte

Gracias por tu ayuda, me ha servido.. Sólo un detalle.. para agregarle la clase a mi nuevo DIV faltaba agregar esto..

Código Javascript:

Ver originalnewDiv.setAttribute("class", "otroDiv");

Asi me ha quedado la función.

Código Javascript:

Ver originalnewDiv = document.createElement("div");
newInput = document.createElement("input");
newInput.setAttribute("type", "file");
newDiv.setAttribute("class", "otroDiv");
newDiv.appendChild(newInput);
document.getElementById('divTest').appendChild(newDiv);

Gracias

Adler · #6 (**permalink**) 16/08/2010, 12:47

Cita:

Iniciado por sebacibertico

Gracias por tu ayuda, me ha servido.. Sólo un detalle.. para agregarle la clase a mi nuevo DIV faltaba agregar esto..

Código Javascript:

Ver originalnewDiv.setAttribute("class", "otroDiv");

No he dicho que no fuera así, ni lo contrario. Todo atributo que quieras añadirle al elementos solo has de hacer referencia a la propiedad y el valor el valor de esa propiedad