La función alert() (Cuadro de alerta).

La función alert() (cuadro de alerta) es un método del objeto window.

Se utiliza para crear un cuadro de diálogo con mensajes, en los cuales el visitante puede:

• Aceptar el mensaje sin posibilidad de interactuar con la página.

Función alert(): Cuando un cuadro tipo alert() es disparado, se muestra un mensaje de texto con un botón de "Aceptar". Lo único que podrá hacer el usuario es leer el mensaje y aceptarlo. El valor que devuelve este cuadro al ser aceptado es "undefined", por lo tanto, no podremos capturar ningún dato de él, pero sí podremos usar la cadena de texto "undefined" en alguna operación del JavaScript.

Estructura de alert()

• alert ("expresion-javascript")

Captura de un cuadro tipo alert()

La expresion-javascript es el mensaje de texto alfanumérico que se muestra en el cuadro. Si este valor es una cadena de texto debemos colocarlo siempre entre comillas.

De la misma manera podemos definir el texto en una variable para luego ser utilizado como mensaje en el cuadro alert(). El ejemplo del uso de este método con una variable como expresión sería:

var variable = "Texto del cuadro alert()"
alert (variable)

Podemos ver que en este caso se omitieron las comillas. variable tendrá almacenado la cadena de texto que se mostrará en el cuadro de alerta.

Podemos utilizar texto y variables y concatenar ambas para formar frases que cambian según el dato de la variable. El ejemplo sería:

var nombre = "Juan"
alert ("Hola " + nombre + ". Bienvenido!!!")

En este caso el valor a mostrar en el cuadro sería una cadena de texto "Hola " más el valor de la variable (Juan), más la cadena de texto ". Bienvenido!!!"

Vemos cómo se respetó el uso de las comillas en las cadenas de texto ingresadas directamente en la expresión javascript y cómo se omitieron en la variable. También vemos el signo + que nos permite concatenar cadenas de texto.

En los ejemplos anteriores se utilizaron variables que contienen cadenas de texto. En este tipo de cuadro es posible utilizar valores numéricos para realizar cálculos. Supongamos que tenemos dos variables en las cuales tenemos almacenado un número y queremos que en cierto momento se muestre un cuadro alert() con la suma de estos valores. Ejemplo:

var numero1 = 10;
var numero2 = 20;
alert (numero1+numero2+12)

En este caso se sumaron los valores (datos numéricos) y el resultado de esta suma se mostró en el cuadro. Vemos que las variables no están entre comillas y tampoco el número 12 que en este caso es un dato numérico. El mensaje mostrado en el cuadro será 42.

Si en el mismo ejemplo utilizamos para la variable numero1 una cadena de texto, automáticamente los datos numéricos se transformarán en cadena de texto por lo que se mostrará un mensaje concatenado de todos los valores escritos en el cuadro alert(). Ejemplo:

var numero1 = "Este no es un número";
var numero2 = 20;
alert (numero1+numero2+12)

El ejemplo devolverá como resultado: "Este no es un número2012". Vemos que se concatenó el valor de la variable numero1 más numero2 más 12 que en este caso ya no será un dato numérico sino una cadena de texto.

Algo a tener en cuanta en este tipo de cuadro es que si el usuario no presiona el botón de "Aceptar" no podrá seguir trabajando en la página ya que éste queda en primer plano impidiendo la selección de los demás objetos del documento. Esto se vuelve una gran ventaja cuando queremos obligar al visitante a leer el mensaje antes de seguir leyendo la página.

En el caso que queramos mostrar varias líneas de texto debemos utilizar el caracter especial \n que nos permite crear una nueva línea en el mensaje. Ejemplo:

alert("Esta es una línea\nY esta es otra.")

Esto podemos utilizarlo cuando el mensaje es muy largo y no queremos que el cuadro tenga un ancho excesivamente largo.

Algo muy interesante que nos permite realizar JavaScript es asignar al mensaje del alert() un valor ya definido en algún objeto de formulario HTML. Supongamos que tenemos un formulario con un elemento de tipo text (cuadro de texto) y queremos que el texto escrito en éste se muestre en el mensaje del cuadro. Ejemplo:

alert(document.formulario.cuadrodetexto.value)

Aquí se mostrará el texto escrito en el cuadro de texto. Si el cuadro de texto no contiene ningún texto se mostrará una cadena vacía, es decir, nada.