Post Top Ad

Your Ad Spot

domingo, 4 de octubre de 2020

Crear formulario HTML con JavaScript

 Este tutorial trata sobre la creación de formularios utilizando JavaScript.

En este tutorial, veremos cómo crear un formulario html simple usando JavaScript paso a paso.

Entonces, si desea crear un formulario dinámicamente con javascript, debe leer este tutorial.

Demo en vivo

Primero escribimos el marcado HTML.

HTML

<html>    
<body>
<div id = "formcontent">
</div>
</body>
</html>

JavaScript

Aquí escribimos un script para crear un formulario y lo adjuntamos encima de div.

<script> 
var content = document.getElementById ("formcontent");
var url = 'http://www.phpcluster.com';
var form = document.createElement ("formulario");
form.setAttribute ('método', 'publicación');
form.setAttribute ('acción', url);
form.setAttribute ('objetivo', 'pclu');

// Crea un
encabezado var de entrada = document.createElement ('h2'); // Encabezado del formulario header.innerHTML = "Form";
form.appendChild (título);

var linebreak = document.createElement ('br');
form.appendChild (salto de línea);

var namelabel = document.createElement ('etiqueta'); // Crear etiqueta para el campo de nombre namelabel.innerHTML = "Nombre:";
var inputelement = document.createElement ('entrada'); // Crear campo de entrada para el nombre inputelement.setAttribute ("tipo", "texto"); inputelement.setAttribute ("nombre", "nombre");
form.appendChild (inputelement);

var linebreak = document.createElement ('br');
form.appendChild (salto de línea);

var emaillabel = document.createElement ('etiqueta'); // Crear etiqueta para el campo de correo electrónico emaillabel.innerHTML = "Correo electrónico:";
form.appendChild (emaillabel); var inputelement = document.createElement ('entrada'); // Crear campo de entrada para el nombre inputelement.setAttribute ("type", "email"); inputelement.setAttribute ("nombre", "correo electrónico");
form.appendChild (inputelement);

var linebreak = documento. createElement ('br');
form.appendChild (salto de línea);

var inputbutton = document.createElement ('entrada'); // Crear campo de entrada para el nombre
inputbutton.setAttribute ("tipo", "botón"); inputbutton.setAttribute ("nombre", "enviar"); inputbutton.setAttribute ("valor", "Enviar");
form.appendChild (inputbutton);
content.appendChild (formulario); </script>

Espero que haya creado su propio formulario usando JavaScript. Si tiene alguna consulta no dude en comentarla.

No hay comentarios.:

Publicar un comentario

Dejanos tu comentario para seguir mejorando!

outbrain

Páginas