Validar un campo de texto con javascript

Crearemos cuatro campos de entrada, para el nombre de usuario, el correo electrónico, la contraseña y la confirmación de la contraseña. Para fines de estilo y control, envolveremos estas etiquetas de entrada en divs con la clase control de entrada. Cada uno de estos controles de entrada contendrá una etiqueta, una entrada y un div con la clase error.

Cada entrada debe tener un atributo id y name. Las etiquetas deben tener una propiedad for que coincida con el atributo name de la etiqueta input correspondiente. Para el tipo de entrada usaremos text para el nombre de usuario y el correo electrónico, y usaremos password para la contraseña y la confirmación de la misma.

El div con la clase error contendrá los mensajes de error para el campo de entrada específico. Por ahora estará vacío, lo modificaremos desde javascript. Por último, tenemos que añadir un botón para enviar nuestro formulario.

En este ejemplo no vamos a enviar realmente el formulario, sólo a simularlo. Para el botón de envío usaré un botón de tipo submit.