1. JavaScript
Integrantes
Jonathan Roberto Mejía Corona
Gerardo Gil Villareal
Salvador flores Chávez
Juan Carlos Brígido Albino
2. Índice
1. Introducción
2. Un primer ejemplo
3. Constantes y variables
4. Tipos de datos
5. Operadores
6. Estructuras de control
7. Funciones y eventos
8. Objetos
3. 1. Introducción
JavaScript es un lenguaje de
programación creado por Netscape que se
integra dentro de HTML y nos permitirá
crear páginas interactivas.
4. JavaScript ≠ JAVA
JavaScript es un lenguaje que
funciona como extensión HTML y que es
interpretado por el navegador, es
independiente del servidor donde está
alojado.
JAVA es un lenguaje independiente
no necesita HTML para funcionar. El
código no se interpreta en el navegador
5. Al ser (JavaScript) interpretado
en el navegador, una vez cargado el
código se puede ejecutar cuantas veces
sea necesario sin acceder al servidor.
Por ejemplo, podemos crear una
función que compruebe un campo fecha
de un formulario. Si el usuario introduce
una fecha incorrecta, saldrá un mensaje
de error sin tener que cargar una nueva
página.
6. Como ocurre con CSS la
interpretación que cada navegador hace
de un código puede ser muy particular.
Iexplorer soporta una especie de
JavaScript llamado jscript, que es muy
similar a JavaScript, pero no es
compatible 100%. Por este motivo
debemos comprobar el código que
realicemos en distintos navegadores,
sobre todo en este último, al ser el más
extendido.
7. 1. Inserción en HTML
En una misma página podemos
insertar distintos trozos de código
JavaScript, cada uno de ellos encerrado
entre las directivas:
<SCRIPT languaje=“JavaScript”>
Y
</SCRIPT>
8. <HTML>
<HEAD>
código HTML de cabecera
<SCRIPT>
código JavaScript
</SCRIPT>
<BODY>
código HTML
<SCRIPT>
código JavaScript
</SCRIPT>
código HTML
<SCRIPT>
código JavaScript
</SCRIPT>
código HTML
9. El atributo “languaje” de la etiqueta
SCRIPT indica el lenguaje que vamos a
utilizar, que por defecto es JavaScript,
por lo que podemos omitirlo.
Ejercicio: Lo siguiente es código
JavaScript. Insértalo en una página
HTML de manera correcta y observa el
resultado:
alert(“Esto es una nota informativa”);
10. Nota importante: JavaScript es un
lenguaje sensible a las mayúsculas (Case
Sensitive) por lo que los siguientes
nombres de variables son diferentes:
Resultado
RESULTADO
resultado
11. 1. Inserción en HTML. Archivo Externo
Al igual que CSS podemos crear un
fichero externo que contenga código
JavaScript.
Su extensión será .js
Para llamarlo utilizaremos el atributo src
de la etiqueta SCRIPT
12. TEMA 2. Hojas de Estilo
Ejercicio: dado el código JavaScript
ejecutarlo mediante una llamada a un
fichero externo:
Var hoy=new Date();
Dia=hoy.getDate();
Mes=hoy.getMonth()+1;
Anio=hoy.getYear();
alert(“Hoy es “+Dia+” del “+Mes+” de
Resultado
“+Anio);
13. Comentarios
Se pueden introducir de dos formas
distintas:
// Comentarios en una sola línea
/* En varias líneas: todo lo que
escribamos entre estos dos símbolos no
será tenido en cuenta por el navegador*/
14. Llaves
Podemos encerrar cualquier trozo de
código entre llaves. Más adelante
veremos que el código de una función va
encerrado entre llaves {}
Punto y coma ;
El símbolo ; se utiliza para separar
sentencias. Pondremos uno al finalizar
cada línea de instrucción. Si la
instrucción es larga y ocupa más de una
línea, no pondremos uno en cada línea,
sino de la misma forma, al finalizar la
instrucción.
15. 2. Un primer
ejemplo
<html><body><script language="JavaScript">
imagen1=new Image
imagen1.src="imagenes/dedo.jpg"
imagen2=new Image
imagen2.src="imagenes/dedo1.jpg"
var i=1;
function cambio_icono() {
if (i == 1)
{
document.images['icono'].src=imagen2.src;
i=2;
}
else
{
document.images['icono'].src=imagen1.src;
i=1;
}
}
</script><div align="center"><img src="imagenes/dedo.jpg" name="icono"
onMouseover="cambio_icono()" onMouseOut="cambio_icono()">
</div></body></html>
Resultado
16. 3. Variables y
constantes
Variables
Son elementos que se utilizan en todos los
lenguajes y sirven para almacenar datos
temporalmente.
A la hora de asignar un nombre a una variable
tenemos que tener en cuenta lo siguiente:
• Primer carácter: letra ó _
• Resto caracteres: letras, números ó _ sin
espacios intermedios
• No utilizar palabras reservadas
• Diferencia entre mayúsculas y minúsculas.
Conviene seguir una norma.
17. ResultadoSuma, Resultadosuma y
resultadosuma son tres variables distintas.
En los navegadores antiguos era necesario
declara las variables antes de usarla. En los
actuales no.
Para declarar una variable basta con poner
“var” y seguidamente su nombre:
var nombre1;
19. 4. Tipos de
datos
Tipos de Variables
Existen distintos tipos de variables:
•De cadena: son aquellas que contienen una
cadena de texto. Se definen mediante
comillas simples o dobles. Existen una serie
de caracteres especiales que podemos usar
en ellas: n, t, , ”, ’
Ejemplo:
<script>
var cadena1=“ntEjemplo de ncadena”;
alert (cadena1);
</script>
20. •Numérica: son aquellas que conienen
números.
Ejemplos:
var numero=100;
var numero=-100;
•Booleanas: son aquellas que solo tienen
dos valores posibles, verdadero o falso
(true / false).
var abierta=true;
22. 5. Operadores
En JavaScript los operadores se dividen
en varios grupos:
•Aritméticos
• Lógicos
• De Comparación
• Condicionales
• Bit a Bit
• De asignación
• Especiales
23. Operadores Aritméticos
Son aquellos que se encargan de realizar
los operaciones básicas como suma,
resta, multiplicación, división, módulo,
incremento, decremento,…
24. Ejemplo:
var v1, v2;
var suma, division, modulo;
v1=2;
v2=11;
suma=v1+v2;
division=v2/v1;
modulo=???
document.write("suma: "+suma+"<br>");
document.write("division: "+division+"n");
document.write("modulo: "+modulo+"n");
25. Incremento y decremento son
operadores que suman o restan una
unidad a una variable.
La sintáxis es la siguiente:
variable++;
Ejercicio: crea el siguiente código:
• Declara una variable cualquiera
• Asígnale un valor cualquiera
• Muestra su valor en la página
• Increméntalo con este operador
• Muestra de nuevo su valor
26. Operadores Lógicos
Son los que operan con datos booleanos y
son los siguientes.
&& “y lógico”
|| “o lógico”
! “negación”
27. Ejercicio: Tabla de verdad de && . Rellena los
siguientes valores:
true && true =
true && false =
false && true =
false && false =
true || true =
true || false =
false || true =
false || false =
!false =
!true =
Crea 10 variables, una para cada operación y asigna
cada operación a su variable. Muestra el resultado
mediante alert
28. Operadores de comparación
Sirven para comparar valores y siempre
devuelven “true”o “false”.
Son los siguientes:
Igualdad (a==b): Devuelve “true” si los a y b son
iguales
No igualdad (a!=b): Devuelve “true” si a y b son
distintos
Mayor que (a>b): Devuelve “true” si a es mayor
que b
Menor que (a<b): Devuelve “true” si a es menor
que b
Mayor o igual que (a>=b): Devuelve “true” si a es
mayor o igual que b
Menor o igual que (a<=b): Devuelve “true” si a es
menor o igual que b
29. Ejemplos: Indica el valor de result en cada caso:
<script>
var var1,var2,result;
var1=5;
var2=10;
result=(5==var1);
result=(5!=var1);
result=(var2==var1);
result=(var1>var2);
result=(var1<=var2);
</script>
30. Ejemplos: Indica el valor de result en cada caso:
<script>
var var1,var2,result;
var1=5;
var2=10;
var3=5;
var4=8;
result=(5==var1&&var2==var4);
result=(5==var1||var2==var4);
result=(var1<var2&&var3>=var1);
</script>
31. Operadores condicionales
Es una forma de expresar una instrucción
condicional:
(condicion)?instruccion1:instruccion2;
Ejemplo:
var i,texto;
i=prompt(“Escribe una calificación");
(i<5)?texto=“superado":texto=“no superado”;
document.write(“El examen está: "+texto+"<br>");
32. Operadores bit a bit
Son los que operan con los datos a nivel
de bit. Algunos de estos operadores son:
& operación AND
| operación OR
~ operación NOT
Calcular el resultado de las siguientes
operaciones utilizando estos operadores:
3&5=
3|5=
34. Operadores de asignación
Ya hemos visto la más sencilla de ellas que es
la siguiente:
v1=v2;
Existen otras como:
v1+=v2;
v1-=v2;
Ejercicio: comprueba qué efecto tienen
estas dos operaciones sobre v1.
35. Operadores especiales
Existen otros operadores que no están incluidos en
ninguno de los grupos anteriores. Algunos de ellos
son:
instanceof – indica si un objeto es de un tipo
determinado, por ejemplo:
var result,fecha;
fecha=new Date();
result=fecha instanceof Date;
document.write("resultado de 'instanceof': "+result);
new – crea una instancia de un objeto, por ejemplo:
fecha =new Date();
36. 6. Estructuras
de control
Nos van a servir para tomar decisiones
según ciertas condiciones y para ejecutar
un mismo código repetidas veces variando
algún dato.
En JavaScript disponemos de las siguientes
instrucciones de control:
if => instrucción condicional
for
while => instrucciones de repetición
do while
switch => instrucción de selección múltiple
37. Instrucción if - else
Se utiliza para ejecutar un conjunto de
instrucciones si se cumple una condición y
otro conjunto de instrucciones diferente si
no se cumple.
La sintaxis es la siguiente:
if(condicion)
{ instrucciones A;
}
else
{ instrucciones B;
}
38. El bloque else no es obligatorio, en ese caso
la instrucción quedaría de la siguiente
forma:
if(condicion)
{ instrucciones;
}
La condición es una operación que devuelve
un resultado booleano, true o false, para
ello utilizaremos los operadores lógicos, los
de comparación e incluso operadores
especiales como instanceof.
40. Ejercicio:
Escribe un código que solicite que escribas tu
nombre con el comando prompt. A continuación
solicita que escribas tu primer apellido con otro
prompt, almacenándolo en variables distintas.
Si tu nombre es Alberto Ruíz, aparecerá un
mensaje indicando que tienes permiso para entrar
en la página. De lo contrario, aparecerá un
mensaje indicando que no puedes entrar.
42. Las instrucciones que introducimos dentro del bloque de
instrucciones también pueden ser instrucciones de control,
incluida la instrucción if (if anidados). Ejemplo:
var nombre;
nombre=prompt("Escribe tu nombre","");
if(nombre=="Pepe")
{ alert("Bienvenido/a "+nombre+". Puedes pasar");
}
else
{ if(nombre=="Francisca")
{ alert("Bienvenido/a "+nombre+". Puedes
pasar");
}
else
{ alert("Lo siento. No puede pasar");
}
}
43. Ejercicio: modificar el código anterior de manera
que haga lo mismo, pero utilizando solo una
estructura if
44. Instrucción for
Nos va a servir para ejecutar un mismo código un
número determinado de veces. Para ello hay que
establecer tres parámetros:
• Valor inicial del contador
• Condición, que hará que el bucle pueda llegar en
algún momento a su fin
• Incremento del contador
La sintaxis de esta instrucción es la siguiente:
For(valor incial; condicion; incremento)
{ instrucciones;
}
47. Ejercicio:
Crear un código que pida un número al usuario y
repita una frase tantas veces como indique ese
número
48. Solución:
var cont,n;
n=prompt("escribe un número","");
document.write("Voy a escribir hola "+n+"
veces<br>");
for(cont=0;cont<n;cont++)
{ document.write(cont+" hola<br>");
}
49. Ejercicio:
Crear un código que pida tres veces un número al
usuario y escriba si cada uno de esos números es
mayor, menor o igual a 10.
50. Solución:
var cont,n;
document.write("<u><b>Mayor o menor<br></u></b>");
for(cont=1;cont<4;cont++)
{ n=prompt("Escribe un número: ","");
if(n > 10)
{ document.write("El numero es mayor que
10"+"<br>");
}
else
{ if(n == 10)
{ document.write("El número es
10"+"<br>");
}
else
{ document.write("El número es menor que
10"+"<br>");
}
}
}
51. Ejercicio:
Con la siguiente instrucción se almacena en n un
número del 1 al 10:
n=Math.ceil(Math.random()*10);
Utilizad esta instrucción para crear un juego en el
que el usuario tiene que adivinar el número
indicado. Máximo se permiten 5 intentos.
52. Solución:
var cont,n,p;
n=Math.ceil(Math.random()*10);
for(cont=0;cont<5;cont++)
{ p=prompt("Introduce un número: ","");
if(p == n)
{ alert("enhorabuena!!! Has acertado!!!");
cont=5;
}
else
{ if(n > p)
{document.write("El número es mayor que
"+p+"<br>");
}
else
{ document.write("El número es menor que
"+p+"<br>");
}
}
}
alert("El número correcto era: "+n);
53. Instrucción while
Sirve para ejecutar un conjunto de instrucciones
mientras se cumpla una condición dada.
La sintaxis es la siguiente:
while(condicion)
{ instrucciones;
}
55. Importante:
Hay que prestar mucha atención a la condición, ya
que si se cumple indefinidamente el bucle nunca
finaliza y la ejecución quedará bloqueada.
Ejemplo: en el código anterior, si por error
olvidamos incrementar la variable, siempre se
cumplirá la condición:
var i=0;
while(i<11)
{ alert(“Valor de i: “+i+”<br>”);
i++;
}
57. Ejercicio:
1.- Crear un programa que solicita un nombre de un
alumno y tres notas diferentes. Debe calcular la nota
media e imprimirla junto con el nombre en forma de
tabla:
nombre NotaMedia
2.- Modificar el código anterior de manera que
solicite el número de alumnos al principio y repita el
código para cada uno de los alumnos creando una
tabla con todos ellos
58. Solución:
var i,nombre,n1,n2,n3,media;
n1=0;
n=prompt("Introduce el número de alumnos","");
document.write("<table
border=2><tr><td>Nombre</td><td>Media</td></tr>");
for(i=1;i<=n;i++)
{ nombre=prompt("Nombre: ","");
n1=parseInt(prompt("Nota1",""));
n2=parseInt(prompt("Nota2",""));
n3=parseInt(prompt("Nota3",""));
media=(n1+n2+n3)/3;
document.write("<tr><td>"+nombre+"</td><td>"+media+"</td
></tr>");
}
document.write("<table>");
59. Esta instrucción no existía en versiones antiguas de
JavaScript, por lo que puede que no funcione en
navegdores antiguos.
Es muy similar al bucle while, la única diferencia es
que antes de evaluar por primera vez la condición
ejecuta el bloque de código, por lo que siempre se
ejecuta al menos una vez.
Sintaxis:
do
{ instrucciones;
}while(condición);
60. Código con while:
var i=0;
while(i<0)
{ alert(“Mensaje”);
}
Código con do while:
var i=0;
do
{ alert(“Mensaje”);
}while(i<0);
61. 7. Funciones y
eventos
Una función es un conjunto de instrucciones que
ejecutan una tarea concreta.
Debemos diferenciar entre definición de la
función y llamada a la función. La definición es
la descripción de la función en sí y que será
ejecutado cuando sea llamada.
62. Partes de una función
Una definición de función consta de las
siguientes partes:
• Palabra clave function
• Nombre de la función. Las reglas para crear
este nombre son las mismas que para crear
nombres de variables
• Argumentos. Son los valores que pasamos a
una función cuando la llamamos y que pueden
ser utilizados en su código. Los argumentos se
separan entre sí por comas y se encierran entre
llaves. La lista de argumentos puede ser vacía.
• Instrucciones. Van encerradas entre llaves
63. Sintáxis:
function nombre_funcion(argumentos)
{ instrucciones;
}
La definición de las funciones se suele situar en
la cabecera del documento.
La función no se ejecuta hasta que es llamada
por su nombre de la siguiente forma:
nombre_funcion();
65. Argumentos
Los argumentos son los valores que se pasan en
la llamada y se podrán utilizar en las
instrucciones de la función.
Ejemplo:
<head>
<script>
function saludo(nombre)
{ document.write(“HOLA ”+nombre);
}
</script>
</head>
<body>
<script>
n=prompt(“Nombre”,””);
saludo(n);
</script>
66. Valor de una función
Las funciones también pueden devolver valores.
Esto se hace con la instrucción return de la
siguiente forma:
function Mitad(valor)
{ return valor/2;
}
La llamada a esta función sería por ejemplo;
n=Mitad(10);
Después de ejecutar la instrucción el valor de n
es 5.
67. Eventos
Los eventos son sucesos que ocurren cuando el
usuario realiza una acción, como por ejemplo
pulsar un botón o pasar sobre una imagen.
68. Los eventos se están asociados a elementos
HTML, no a elementos JavaScript.
Para asociar el evento a un conjunto de
instrucciones, creamos una función y la
llamamos cuando se produzca el evento
utilizando los atributos de evento de las etiquetas
HTML.
70. 8. Objetos
Un objeto es algo que tiene unas
características y un comportamiento
particular. Es un conjunto de
propiedades y funciones (llamadas
métodos).
71. Ejemplo:
Una persona tiene unas características
o propiedades : pelo corto, altura, color
de pelo, peso,...
Además de propiedades una persona
también tiene un comportamiento,
ejecuta ciertas acciones: comer,
dormir,...
El conjunto de propiedades y
acciones/funciones definen un objeto.
72. En JavaScript existen una serie de objetos
predefinidos, con sus propiedades y
funciones (métodos), algunas de las cuales
ya hemos utilizado.
Uno de los objetos más importantes es el
objeto Window, que contiene a su vez otros
objetos, estructurados en forma de árbol.
73. La estructura es la siguiente:
self
self
document
document Objeto
Objeto
document
document
navigator
navigator
window
window
Screen
Screen
Forms
Forms
History
History
Location
Location
74. Para hacer uso de las propiedades y métodos de un objeto
debemos poner el nombre del objeto seguido de un punto y
la propiedad o el método a continuación, por ejemplo:
window.status=“mensaje”;
Los métodos son funciones que podemos ejecutar y las
propiedades son simplemente variables que podemos
asignar o leer.
75. Ahora veremos algunos ejemplos de
propiedades y métodos de los objetos más
utilizados
76. Objeto window
La propiedad status del objeto window indica el
mensaje que aparece en la barra de estado.
Ejercicio:
Crea una página que contenga un hipervínculo.
Al pasar por encima aparece la dirección de destino
en la barra de estado.
Añade el código JavaScript necesario para que al
pasar por encima aparezca el mensaje “Estás sobre el
enlace” en la barra de estado.
Cuestión: ¿Funciona en todos los navegadores?
77. El método open abre una ventana nueva con las
propiedades que le indiquemos.
La sintaxis es:
ventana=open(“URL”,”nombre”,”opciones”)
donde opciones será una lista separada por comas de
las siguientes propiedades:
toolbar location
directories
status menubar scrollbars
resizable width height
Ejemplo:
ventana=open(“URL”,”nombre”,”toolbar=no,menuba
r=no,status=yes,width=200,height=200,resizable=yes
);
78. Ejercicio:
Crea una página que contenga un botón que
al pulsarlo (evento onclick) abra una página
en las que no aparezca ninguna barra salvo
la de estado y no se pueda redimensionar y
además ponga un mensaje en la barra de
estado.(prueba en distintos navegadores)
79. Otros métodos del objeto window son:
alert
prompt
confirm
close
Print
setInterval
setTimeout
Ejercicio: utilizando la ayuda de Internet
pon un ejemplo con cada uno de ellos
80. <script>
var edad=prompt("Indica tu edad");
while(!confirm("Tu edad es: "+edad))
{ edad=prompt("Indica tu edad");
}
if(edad < 18)
{ alert("Eres menor de edad, aún no puedes
desayunar en el Hollywood");
}
else
{ alert("Eres mayor de edad, ya puedes desayunar
con los profes");
}
setTimeout("cerrar()",5000);
document.write("Esta página se autodestruirá en 5
segundos (solo si tienes explorer)");
function cerrar()
{ window.close();
}
</script>
<br><a href="javascript:window.print()">Imprimir esta
página</a>
81. Ejercicio: crea una página con un botón
y que al pulsarlo la ventana tome el
tamaño 600x400 píxeles y se coloque en
la posición 100,100. de la pantalla
82. Objeto navigator
El objeto navigator permite obtener datos del
navegador que estamos utilizando.
Por ejemplo, la propiedad appName facilita el
nombre del navegador utilizado, y la propiedad
languaje el lenguaje del mismo:
alert("Navegador: "+navigator.appName);
alert(“Idioma : "+navigator.language);
Estas propiedades son solo de lectura
83. Podemos utilizar estas propiedades para hacer
uso de la versión de Javascript que más se ajuste
el navegador del cliente. Aunque debemos tener
en cuenta que no son datos muy fiables.
Ejercicio:
Instala el componente “User Agent Switcher” de
Firefox y averigua para qué sirve.
84. Objeto location
Este objeto contiene información sobre la página
que se está visitando en ese momento. Algunas
de las propiedades de este objeto solo tienen
validez si la página está alojada en un servidor,
no si está almacenada localmente.
85. Algunas de sus propiedades son:
href → dirección completa
protocol → protocolo utilizado (http, ftp,…)
host → nombre del servidor y puerto utilizados
hostname → solo nombre del servidor
Estas dos últimas no sirven para archivos
locales
search → almacena los argumentos de llamada a la
página, lo que acompaña a ‘?’ (cuando existe) en la barra de
direcciones
Algunos de sus métodos son:
reload() → recarga la página
replace(url) → carga la página que se indique entre los
paréntesis. Para ello hay que indicar la dirección completa,
incluyendo el protocolo, por ejemplo:
location.replace('file:///D:/ejemplos/status.html')
86. Objeto history
Contiene información sobre las páginas ya visitadas.
La propiedad length indica el número de páginas visitadas
desde esa ventana.
Los métodos de los que disponemos son los siguientes:
back() → carga la página anterior
forward() → carga la página siguiente
go(n) → salta a la página indicada por n, ejemplos:
go(-1) → salta a la página anterior
go(1) → salta a la página siguiente
go(-2) → retrocede dos páginas
87. Objeto history
Ejercicio:
crea una página con cuatro botones:
Uno para retroceder a la página anterior
Otro para avanzar a la página siguiente
Otro para retroceder dos páginas
Otro para avanzar dos páginas
Indica al cargar la página cuántas páginas se han visitado en
esta ventana.
88. Acceso a css desde Javascript
El atributo style es un atributo más de los elementos
HTMl, por lo tanto podremos acceder a él de la misma
forma.
Ejemplo:
var imagen = document.getElementById("imagen");
alert(imagen.style.margin);
89. Nombre de las propiedades del objeto style
La transformación del nombre de las propiedades CSS
compuestas consiste en eliminar todos los
guiones medios (-) y escribir en mayúscula la letra
siguiente a cada guión medio.
Ejemplos:
▪ font-weight se transforma en fontWeight
▪ line-height se transforma en lineHeight
▪ border-top-style se transforma en borderTopStyle
▪ list-style-image se transforma en listStyleImage
Ejemplo:
document.getElementById("enlace").style.textDecoration
="none";
90. Ejemplo
<a href=http://wwws.google.com id=enlace onmouseover=camba()
onmouseout=camba()>Enlace a google</a>
<script>
function camba()
{
if(document.getElementById("enlace").style.color!="red")
{ document.getElementById("enlace").style.color="red";
document.getElementById("enlace").style.textDecoration="none";
}
else
{ document.getElementById("enlace").style.color="blue";
document.getElementById("enlace").style.textDecoration="underline";
}
}
</script>
Descripción:
Al pasar sobre el enlace cambiará de color y desaparece
el subrayado. Al salir vuelve a su estado anterior. Similar
a la pseudoclase hover.
91. Objeto document
Hace referencia al contenido del documento HTML. Es
el nodo raíz del DOM.
Algunas de las propiedades son:
bgColor: color de fondo
fgColor: color del texto
vlink: color de los enlaces visitados
alink: color de los enlaces activos
Uno de los métodos más utilizados es write(), que ya
conocemos de sobra para qué sirve.
92. Para utilizar el dato del cuadro de texto
nombrePropietario debemos escribir:
document.getElementById(“nombrePropietario”).value
93. Si quisiéramos copiar el dato que el usuario ha escrito
en el cuadroo nombreInquilino tendremos que usar la
siguiente instrucción de asignación:
document.getElementById(“nombreInquilino”).value
=
document.getElementById(“nombrePropietario”).value
Ejercicio: completa el código de la página para que al
pulsar el botón se copien los datos de nombre y
apellidos de propietario a los del inquilino
94. Ejercicio:
Crea un formulario con dos cuadros de texto. Nombre
y edad.
Al pulsar el botón, se debe comprobar que ninguno de
ellos sea vacío y que además, la edad sea un número
entre 16 y 65. Si ésto se cumple, llamaremos al
método sumbit() del objeto formulario, para que pase a
la siguiente página. De lo contrario aparecerá un solo
“alert” indicándonos que hay algo mal y no saltará a
ninguna página.
96. Otros objetos
Otros objetos:
String: sirve para manejar cadenas
Math: para realizar operaciones matemáticas
Date: para manejar fechas
Array: para manejar matrices
97. Objeto Math
abs(): Devuelve el valor absoluto de un número. El
valor después de quitarle el signo.
ceil(): Devuelve el entero igual o inmediatamente
siguiente de un número. Por ejemplo, ceil(3) vale 3,
ceil(3.4) es 4.
floor(): Lo contrario de ceil(), pues devuelve un número
igual o inmediatamente inferior.
max()
Retorna el mayor de 2 números.
random(): Devuelve un número aleatorio entre 0 y 1.
Método creado a partir de Javascript 1.1.
98. Ejercicio:
Crea una página en javascript que genere un número
aleatorio entre 1 y 100, y pida al usuario que lo adivine
(puedes utilizar el método prompt)..
Seguirá preguntando hasta que el número sea
adivinado.
Cada vez que el usuario introduzca un número se debe
indicar si el número secreto es mayor o menor.
99. <script>
var x=Math.ceil(Math.random()*100);
var a;
do
{ a=prompt("Adivina un número del 1 al 100");
if(a<x)
{ alert("El número es mayor");
}
else
if(a>x)
{ alert("El número es menor");
}
else
alert("Acertaste!!!");
}while(x!=a);
</script>
101. Objeto String
length: Longitud de la cadena
split(separador): Sirve para crear un array a partir de una
cadena en el que cada elemento es la parte de la cadena que
está separada por el separador indicado por el parámetro.
substring(inicio,fin): Devuelve el substring que empieza en el
carácter de inicio y termina en el carácter de fin.
ToLowerCase(): Pasa todos los caracteres de una cadena a
minúsculas.
toUpperCase(): Pone todas los caracteres de un string en
mayúsculas.