Entendido.

Este sitio utiliza cookies para analizar la navegación. Si continúa navegando se entiende que acepta su uso. Ver más detalles.";

Logo

Aprende Web

Crea y diseña tus sitios en la Web.

Manual de Javascript

Javascript: lenguaje interactivo para dinamizar la web.


Y ahora tambien aprende a programar en C++ con Aprende Web C++

logo rss RSS. Suscribir canal.

Buscar en Aprende Web

Traducir página

Visita nuestro blog:

bolg.aprende-web.net

y entérate de las novedades o deja un comentario.

Dudas y sugerencias:

aprendeweb@aprende-web.net





Sobre ésta página

Ültima modificación: 29-01-2016.

Visitas este mes: 80

Visitas el mes pasado: 154

logo
WEB-GRAFÍA

Mi agradecimiento a los siguientes sitios en los que me he basado para la elaboración de este manual.:

Desarrollo Web: manual de Javascript
Desarrollo Web, por Miguel Angel Álvarez
Libros Web: introducción a Javascript
Libros web, por Javier Eguíluz Pérez
Curso de Javascript: Programación Web
www.programacionweb.net
WebEstilo: JavaScript
www.webestilo.com
W3 schools; Javascript Tutorial
www.w3schools.com
Manual de Javascript: José Antonio Rodríguez.
Jose Antonio Rodriguez: manual en PDF

Donativos

Si este sitio te parece interesante puedes contribuir con una pequeña aportación.




4. Estructuras básicas (V)

4.5 Condicionales II

javascript

Operadores Lógicos

Puede ser que queramos que para que se realice una determinada acción con javascript se tenga que cumplir más de una condición a la vez, otras veces puede haber varias condiciones, y queremos que al cumplirse sólo una de ellas, la acción pueda realizarse, para ello están los operadores lógicos.

Al igual que con los operadores condicionales, los valores que devuelven los operadores lógicos son siempre booleanos, es decir, true (verdadero) o false (falso).

Los operadores lógicos son los siguientes:

Operadores lógicos
Nombre Signo Descripción Ejemplo
AND && Devuelve true sólo si las dos condiciones son verdaderas, si no es así devuelve false n1 != n2 && n1 != n3
OR || Devuelve true si una de las dos condiciones es verdadera, sólo si las dos son falsas devuelve false n1 == n2 || n1 == n3
Negación ! Cambia el valor del elemento al que se le aplica es decir, si variable vale true, !variable valdrá false !variable

El operador lógico OR || se escribe mediante dos veces la barra vertical que se encuentra pulsando la tecla Alt Gr y el numero 1 (en la esquina superior izquierda).

Veamos un ejemplo de script en el que usamos los operadores lógicos:

function numero(){
         num = prompt("Escribe un número del 10 al 20");
         num = Number(num);
         if ( num <=10 || num >=20 ) {
             alert("Este número no es valido");
             }
         else {
             alert("El número es correcto");
             }
         }

Para hacer funcionar este script usaremos un párrafo con el atributo onclick llamando a la función:

<p onclick="numero()">Ver el script</p>

Si pulsas en el siguiente párrafo puedes ver el script anterior en marcha:

Ver el script


Anidar estructuras if

A veces las opciones entre las que queremos elegir son más de dos, es decir la estructura if ... else ... se queda pequeña, ya que sólo permite seguir dos opciones. Para ello podemos anidar varias estructuras if mediante el codigo siguiente:

if (condicion) {
    sentencias javascript;
    }
else if (condicion) {
    sentencias javascript;
    }
else if (condicion) {
    sentencias javascript;
    }
.....
else {
    sentencias javascript;
    }

El navegador comprueba si se cumple la primera condición, si no es asi, pasa a comprobar la segunda (en el primer else if), luego a la tercera, y si no se cumple ninguna se ejecutará el código que está en último lugar (en else).


Ejemplo de estructura if

Veremos aquí un ejemplo de estructura if que puede integrarse en una página web, para ello una vez que tenemos creada la página, en la cabecera introduciremos el siguiente código javascript:

<script type="text/javascript">
function datos(){
         var nombre = prompt("¿Cómo te llamas?");
         var edad = prompt("¿Cuántos años tienes");
         texto = document.getElementById("respuesta");
         edad = Number(edad);
         if (edad >0 && edad <=14 ) {
             texto.innerHTML = "Hola " + nombre + ", Todavía eres un niño";
             }
         else if (edad >=15 && edad <=21 ) {
             texto.innerHTML = "Hola " + nombre + ", Aún eres un joven adolescente.";
             }
         else if (edad >=22 && edad <=35 ) {
             texto.innerHTML = "Hola " + nombre + ", Eres una persona joven.";
             }	
         else if (edad >=36 && edad <=55 ) {
             texto.innerHTML = "Hola " + nombre + ", Ya no eres tan joven"; 
             }	
         else if (edad >=56 && edad <=65 ) {
             texto.innerHTML = "Hola " + nombre + ", Eres una persona madura";
             }	
         else if (edad >=66 && edad <=99 ) {
             texto.innerHTML = "Hola " + nombre + ", Ya estás en la tercera edad";
             } 
         else if (edad >=100 && edad <=130 ) {
             texto.innerHTML = "Hola " + nombre + ", Felicidades, has llegado a centenario"; 
             }	
         else { 
             texto.innerHTML = "Hola " + nombre + ", Creo que no me estas diciendo tu verdadera edad"; 
             } 
				 }			 
</script>

En el código HTML, dentro del body debemos insertar las dos etiquetas siguientes, la primera, para activar el código, y la segunda para poder ver la respuesta.

<p onclick="datos()">Pulsa aquí para decirme tu nombre y edad</p>
<p id="respuesta"><p>

Puedes ver este script en la página del siguiente enlace:

Estructura if


En el ejemplo, si escribes diferentes números para la edad (al pulsar sobre el párrafo que lo pregunta), verás que salen diferentes respuestas según el número que hayas puesto.

Aparte de la estructura if hay también otros tipos de estructuras para elegir entre varias condiciones, las cuales las veremos en temas posteriores; aunque la estructura if es la más usada.




En la siguiente página veremos el tipo de estructura en bucle, que permite repetir una acción varias veces.

Bucles



manual de Javascript

Anterior siguiente ... Siguiente siguiente


imprimir esta página

Página creada por ANYELGUTI.

Sugerencias: aprendeweb@aprende-web.net. Envia un manda un correo

Visita nuestro blog par saber en qué estamos trabajando: Aprende Web Blog

Más sobre anyelguti en http://anyelguti.16mb.com