UNIVERDIDAD DEL AZUAY FACULTAD DE ADMINISTRACION ESCUELA INGENIERIA DE SISTEMAS

UNIVERDIDAD DEL AZUAY
FACULTAD DE ADMINISTRACION
ESCUELA INGENIERIA DE SISTEMAS
MANUAL DE JAVASCRIPT
REALIZADO POR:
Cristina Mariuxi Flores Urgilés
MATERIA:
Programación Web
PROFESOR:
Ing. Pablo Ezquivel
CURSO:
Quinto “A”
AÑO LECTIVO:
2005-2006
JAVASCRIPT
JavaScript es un lenguaje interpretado, posee una característica que lo hace
especialmente idóneo para trabajar en Web, ya que son los navegadores que
utilizamos para viajar por ella los que interpretan (y por tanto ejecutan) los
programas escritos en JavaScript. De esta forma, podemos enviar
documentos a través de la Web que llevan incorporados el código fuente de
programas, convirtiéndose de esta forma en documentos dinámicos, y
dejando de ser simples fuentes de información estáticas.
Cómo incluir JavaScript en páginas de HTML?
1. La forma general es la que sigue:
<SCRIPT LANGUAGE="JavaScript">
Sentencias de JavaScript ....
</SCRIPT>
Pueden ponerse cuantos se quieran a lo largo del documento y en cualquier
lugar.
2. Si lo que se quiere es incluir un archivo de JavaScript en lugar de insertar las
líneas
de programa en la página HTML:
<SCRIPT SRC="Archivo. js ">
...
</SCRIPT>
Documentación
Para documentar información acerca de la aplicación utilizamos:
1. / Para documentar una línea.
2. /* */ Para documentar varias líneas.
Características del lenguaje
Para trabajar con JavaScript tenemos que considerar lo siguiente:
1. No se declara las variables
2. Todas las sentencias terminan en ;
Tipos de Datos
Los tipos de datos se representan de la siguiente manera:
Datos enteros
Datos decimales
Datos en notación científica
Cadenas de texto
Expresiones Booleanas
X=20;
X=25.7;
X=2.3 E -2;
X="dato";
X='dato'
X= true;
X= false;
La conversión de datos.
JavaScript no es un lenguaje con tipos por consiguiente, cuando se declara una
variable
no es necesario precisar su tipo. El contenido de la variable se convertirá
automáticamente
en el transcurso del programa según su uso.
El esquema de conversión del tipo se basa en el principio siguiente: el tipo
asociado
corresponde al de operando de la izquierda. Esto se debe a que la evaluación
se realiza
de izquierda a derecha.
Por ejemplo, supongamos la definición de las variables siguientes:
var una_string = "7";
var un_numero = 42;
Si evaluamos las siguientes expresiones.
x = una_string + un_numero;
y = una_numero + una_string;
La primera expresión convertirá la variable un _ numero en una cadena de
caracteres porque el
operando de la izquierda una_string es una cadena de caracteres.
Esta expresión concatena las dos cadenas de caracteres y el resultado x es:
"742".
Por el contrario, la segunda expresión convierte la cadena una_string en un
valor numérico
porque el operando de la izquierda un _ numero, es como su propio nombre
indica, un número.
Esta segunda expresión suma los dos números y el resultado y es: 49.
La conversión de tipos no puede hacerse en todos los casos posibles: ciertas
cadenas de caracteres
no pueden convertirse en número. Tales conversiones generan un
error. Por ejemplo:
var una_string = "Pepe";
var un_numero = 578;
y = una_numero + una_string;
ERROR: Pepe no puede convertirse en número
Vectores
Para crear un vector se debe instanciar del objeto array ya creado.
var vector=new array();
vector[0]="Hola"
vector[1]="Mundo"
Operadores
+
Suma
-
Resta
*
Multipilicacion
/
Division
%
Residuo
&&
Y
!
No
||
O
>
Mayor
<
Menor
<=
Menor Igual
>=
Mayor Igual
!=
Diferente
==
igual
Operadores de Asignación
==
-=
*=
/=
+=
%=
K++
++K
Estructuras de Control
Operadores
IF
EJEMPLO
if (isNaN(obj.value))
{
If (condicion)
{
Expresiones
}
Else
{
Expresiones
}
window.alert('campo no
numérico);
return false;
}
else
return true;
FOR
EJEMPLO
for
(inicialización;condición;actualización)
{
sentencias a ejecutar en cada
iteración
}
While
while (condición)
{
sentencias a ejecutar
}
for (i=343;i>=10;i--)
{
document.write(i)
}
EJEMPLO
var suma = 0
while (suma < 1000)
{
suma +=
parseInt(Math.random()
* 100)
document.write
(suma)
}
SWITCH
EJEMPLO
switch (expersión)
{
case valor1:
Sentencias a ejecutar
break
Switch
(dia_de_la_semana)
{
case 1:
document.write("Es
case valor2:
Sentencias a ejecutar
break
case valor3:
Sentencias a ejecutar
break
default:
Sentencias a ejecutar
}
Lunes")
break
case 2:
document.write("Es
Martes")
break
case 3:
document.write("Es
Miércoles")
break
case 4:
document.write("Es
Jueves")
break
case 5:
document.write("Es
viernes")
break
case 6:
case 7:
document.write("Es
fin de semana")
break
default:
document.write("Ese día
no existe")
}
FUNCIONES EN JAVASCRIPT
Definición de funciones.
La instrucción FUNCTION permite la definición de funciones. Después de esta
palabra reservada se coloca el nombre de la función seguido de una lista de
argumentos delimitados por paréntesis y separados por comas.
Function nombre (param1, param2,..., paramn)
{
instrucciones en JavaScript;
}
La sentencia return.
La sentencia return es la que permite devolver el resultado de una función.
En el ejemplo que se verá a continuación, se muestra una función que
devuelve
el área de un cuadrado de lado l.
function Cuadrado(numero)
{
return numero * numero;
}
TIPOS DE EVENTOS.
Los eventos que existen son los siguientes:
Ver Ejemplo
Evento
Click
Descripción
Asociado a
Pulsación sobre un enlace o un elemento
Ratón
de un form
MouseOver Colocación del ratón sobre un enlace
Ratón
Load
Carga de la página.
Página
UnLoad
Salida de la página.
Página
Focus
Seleción de un elemento de un form.
Teclado/Ratón
Blur
Des-seleción de un elemento de un form. Teclado/Ratón
Change
Edición de un elemento de un elemento
text, textarea o cambio de un select en
un forma.
Teclado/Ratón
Select
Seleción del campo de entrada de un
elemento de un form.
Teclado/Ratón
Submit
Envío de un form.
Teclado/Ratón
Abort
Interrupción de la carga de una página o
Página
imagen
Error
Error en la carga o ejecuciónde una
página o imagen
Página
MouseOut
Salida del ratón de un área o enlace.
Ratón
Reset
Pulsació de un reset en un form.
Teclado/ratón
DblClick
Pulsación de doble Click sobre un enlace
Ratón
o un elemento de un form
DragDrop
Se produce cuando se deja caer algo
sobre la ventana.
Ratón
MouseDown
Pulsación de un botón del Ratón sobre
un documento, enlace o form.
Ratón
MouseMove Movimiento del cursor del Ratón.
Ratón
MouseUp
Liberación de un botón del Rtón sobre
un docuemnto, enlace o form.
Ratón
KeyDown
Pulsación de una tecla.
Teclado
KeyUp
Liberación de una tecla.
Teclado
KeyPress
Cobinación de KeyDown y KeyUp.
Teclado
Move
Movimiento de la ventana o un frame.
Ventana
Resize
Redimensionamiento de la ventana o un
Ventana
frame.
OBJETOS JAVASCRIPT
Javascript es un lenguaje orientado a objetos, es decir, podrá manejar
diferentes objetos,
tales como: a ventana, el documento, las etiquétaselos formularios.
Cada uno de estos objetos tienen una serie de características, a las que
llamaremos
propiedades. Además cada objeto podrá realizar toda una serie de cosas,
a las que
llamaremos métodos.
Para hacer referencia a una propiedad se utiliza la sintaxis:
nombredeobjeto.propiedad
y para hacer referencia un método se utiliza la misma sintáxis aunque suele
acabar con una
apertura y cierre de paréntesis:
nombredeobjeto.metodo().
Una primera clasificación del modelo de objetos lo dividiría en dos grandes
grupos. Por
una parte, tendríamos los objetos directamente relacionados con el
navegador los cuales
trataremos a continuación y por otra parte un conjunto de objetos
relacionados con la
estructura del lenguaje, llamados genéricamente objetos del lenguaje.
Objetos del Navegador
Jerarquía
Los objetos se definen según una jerarquía relacionada con la ventana de
presentación y los
elementos del propio documento HTML.
Así, la ventana window del cliente Web tiene una propiedad document, que
hace referencia
al documento HTML que está mostrando. Este documento, a su vez, está
formado por objetos que
se corresponden con cada uno de los elementos que lo componen: imágenes,
enlaces, formularios,...
El objeto window creado por el navegador se encuentra en la raíz de la
jerarquía
que describe el contenido del documento HTML. Tiene a disposición de
los programadores
una larga lista de métodos.
Vamos a ver ahora los distintos métodos que tiene el objeto window.
Métodos del objeto Window
window.alert('Mensaje'):
Crea una ventana de diálogo en la que se muestra el mensaje.
window.Confirm('Pregunta'):
Crea una ventana de confirmación (OK/Cancel) en la que se visualiza la
cadena de caracteres "mensaje".
El valor devuelto es true si el usuario elige la opción OK y false en caso
contrario.
Ejem:
function confirmacion()
{
Var respuesta=window.confirm("Ud vive en Cuenca”);
If (respuesta==true)
window.alert ("Respuesta afirmativa");
Else
window.alert ("Respuesta negativa")
}
window.prompt("mensaje","texto"):
Crea una ventana de diálogo en la que se visualiza la cadena de caracteres
"mensaje" y permite la edición de una cadena de caracteres. El parámetro
"texto" representa el valor predeterminado. Esta ventana, al igual que confirm,
posee dos botones aceptar y
cancelar. Si se pulsa aceptar este método devolverá el texto insertado
por el usuario o el que se daba por defecto si el usuario no ha
introducido nada, mientras que si se pulsa cancelar dicho método
devolverá null.
Ejem:function m_prompt()
{
var texto=window.prompt("Introducir nombre:","");
if( texto==null)
{
window.alert("Operación cancelada");
else
window.alert("Su nombre es: "+texto)
}
}
window.open("URL","Nombre","Características"):
Crea una nueva ventana, le asocia el nombre y accede al URL
indicado, si éste campo se pasa "en blanco" obtendremos una
ventana vacía. La Características son un conjunto de
parámetros que describen las propiedades de la ventana. En la
siguiente tabla podemos ver cada uno de estos parámetros con su
significado.
Parámetro
Toolbar
Width
height
Left
Descripción
Crea una barra de herramientas
con botones:back,foward,..etc
Especifica la anchura de la
ventana en pixeles
Especifica la anchura de la
ventana en pixeles
Especifica la posicion de la
ventana y utilizada en Internet
explorer
Crea la barra de menus en la parte
superior de la ventana
El usuario puede modificar el
resizable
tamaño de la ventana
Indica la posicion de la ventana
Top
utilizada en Internet Explorer
Crea las barras scroll horizontal y
Scrollbars
ventical cuando sea necesario
Crea la barra de estado en la parte
Status
inferior de la ventana
El usuario puede modificar el
Titlebar
tamaño de la ventana
Asigna la misma ventana al mismo
Copyhistory
historico
Crea la barra de botones estandar
Directories
del navegador
Menubar
OBJETO HISTORY
Este objeto guarda la información sobre los URLs que el usuario ha visitado
dentro de una ventana determinada. La información aquí guardada es la que se
lee sobre el menú Go del navegador.
Propiedades Objeto History
Propiedad length: Esta propiedad guarda el número de entradas en el
documento.
Métodos Objeto History
Método back(): Este método accede al URL anterior .
Método forward(): Este método accede al documento siguiente contenido en
el histórico.
Método go(índice): Este método carga el URL indicado en el índice .
Ejem:
history.go(-2);
Retrocede dos paginas guardadas en el histórico .
OBJETO DOCUMENT
El objeto document contiene la información respecto al objeto actual.g
Metodos del objeto Document
Document.write("código HTML"):
Genera códico HTML en el documento.
Ejem:
function escribir(PrimeraPalabra,SegundaPalabra)
{
document.write(PrimeraPalabra);
document.write(SegundaPalabra);
return;
}
Document.writeln("código HTML"):
Idéntico a write pero inserta un retorno de carro al final.
Ejem:
function escribirl(PrimeraPalabra,SegundaPalabra)
{
document.writeln(PrimeraPalabra);
document.writeln(SegundaPalabra);
return;
}
Document.fgcolor(“Color”)
Ejem:
function colorTexto(x)
{
document.fgColor=x;
return;
}
Document.bgcolor
Ejem:
function colorfondo(x)
{
document.bgColor =x;
return;
}
Document.linkcolor
Ejem:
function colorlink(x)
{
document.linkColor =x;
return;
}
Document.vlinkcolor
Ejem:
function colorTexto(x)
{
document.vlinkColor = x;
return;
}
Document.location
Propiedad del tipo locación que contiene la dirección URL del documento.
OBJETO FORM
El objeto de tipo form se crea por formulario contenido en el documento
(especificado por la marca form).
Cada formulario presente en un documento corresponde a un objeto que se
coloca en la
matriz forms.
Forma de llamar al objeto form
Window.document.forms()
Cuando tenemos varios formularios:
Window.document.forms[].elements[]
Num.Formulario
Num elemento de formulario
Propiedades del objeto form
Propiedad elements[]
Los distintos elementos de un formulario (texto, botones...)
se colocan en la matriz elements, permitiendo así un acceso
simple y genérico a las propiedades del objeto form.
Propiedad action:
Es la acción que queremos realizar cuand se submite un formulario.
Se coloca generalmente una dirección a un programa.php .
Propiedad length:
La propiedad length nos permite conocer el numero de
elementos que contiene la matriz forms[].
Propiedad name:
La propiedad name nos permite conocer el nombre de los elementos
de la matriz forms[].
Metodos DEL OBJETO FORM
Metodo reset:
Para reinicializar todos los campos del formulario, como si se hubiese
pulsado el botón de reset.
Metodo Submit:
Para hacer que el formulario se submita, aunque no se haya pulsado
el botón de submit
OBJETOS BUTTON, SUBMIT Y RESET
Se trata algunos de los objetos imprescindibles en un formulario. Se trata
botones que tienen diferentes acciones. La principal diferencia en su uso
estriba en que el elemento button es simplemente un botón para ejecutar un
código JavaScript cualquiera, no teniendo asociada por defecto ninguna
acción; el elemento submit ejecuta el envío de los datos del
formulario al ser pulsado; por último, el elemento reset borra todos los
campos del formulario, dejando estos con su valor por defecto.
Propiedades
Propiedad disable:
Esta propiedad bloquea el botón de tal forma que el texto se colorea de color
grís y no se puede accionar el mismo.
Propiedad name:
Es la propiedad que va a asignar a cada botón un nombre identificador para
poder referirnos luego a él y acceder a sus propiedades.
Propiedad type:
Esta propiedad se refiere al tipo de objeto al que nos referimos en este caso
button, submit o reset.
Propiedad value:
Esta propiedad determina el texto que va a aparecer contenido en el botón.
Métodos
Método blur:
Este metodo se activa cuando se deselecciona el objeto.
Método click():
Este metodo simula la pulsación de un boton.
Método Focus
Este metodo se activa cuando se selecciona el objeto.
OBJETOS Text, password Y TextArea
El Objeto TEXT es muy utilizado en la construcción de formularios para que el
usuario introduzca un texto, texto que será visible por el mismo en todo
momento, por otra parte PASSWORD se diferencia en que está concebido
para que en él se introduzcan contraseñas, por lo que cuando el usuario
escribe algo en su interior este texto se va almacenando dentro, pero en
pantalla sólo se muestran asteriscos, ****, por motivos de seguridad.
Mientras que el objeto TEXTAREA inicialmente admite el mismo tratamiento
que el objeto text, sus mismas propiedades, métodos y eventos. Pero
además posee una serie de características propias originadas por su propia
definición.
La apariencia del elemento textarea dentro de un formulario es la de una caja
de texto de anchura y altura determinada, que posee scrolls o barras de
desplazamiento propias para poder navegar por su interior
Propiedades Objeto Text, Password y Textarea
Propiedad disable:
Esta propiedad bloquea el objeto de tal forma que el texto se colorea de color
grís y no se puede escribir nada nuevo en el campo.
Propiedad name:
identificador
Es la propiedad que va a asignar a cada caja de texto un nombre
para poder referirnos luego a él y acceder a sus propiedades.
Propiedad type:
Esta propiedad se refiere al tipo de objeto al que nos referimos
en este caso text password y textarea.
Propiedad value:
Esta propiedad determina el texto que va a aparecer contenido en
la campo de texto.
Propiedades Objeto Text y Password
Propiedad Maxlength:
Esta propiedad establece el número máximo de caracteres que
puede contener el campo de texto.
Propiedad size:
Esta propiedad establece la anchura de la campo de texto.
Propiedades Objeto Textarea
Propiedad cols:
Esta propiedad fija la anchura que va a tener el textarea, mediante el número
de columnas de la misma. Si no se especifica este valor, el textarea aparece
por defecto con una anchura estándar, que suele corresponder a 21
columnas.
Propiedad size:
Esta propiead fija la altura que va a tener el textarea, mediante el
número de filas de la misma. Si no se especifica este valor, el textarea
aparece por defecto con una altura estandar, que suele corresponder a 2
columnas.
Metodos Objeto Text, Password y Textarea
Metodo blur:
Este metodo se activa cuando se deselecciona el objeto.
Metodo Focus
Este metodo se activa cuando se selecciona el objeto.
OBJETOS CHECKBOX Y RADIO.
Los elementos de formulario Checkbox y Radio realizan una función parecida
en este: permitir que el usuario elija opciones en un grupo de varias, pero
mientras que en un conjunto de Checkbox puede elegir varias de las opciones,
en un conjunto de Radios sólo puede elegir una de ellas. La forma de incluir
ambos objetos en un formulario también es diferente.
Para incluir un grupo de Checkbox la sintaxis sería:
<INPUT TYPE =" Checkbox" NAME="nombre_1"
VALUE="valor_asociado">texto asociado al checbox 1
<INPUT TYPE =" Checkbox " NAME= "nombre_2" VALUE="
Para incluir un grupo de Radio la sintaxis sería:
<INPUT TYPE = " Radio" NAME= " nombre" VALUE="valor_1">texto asociado
al radio 1
<INPUT TYPE = " Radio" NAME = "nombre" VALUE="valor_2"
Propiedades Objeto Checkbox y Radio
Propiedad disable:
Esta propiedad bloquea el objeto de tal forma que no se puede accionar el
mismo.
Propiedad checked:
La propiedad checked marca o comprueba si está marcado un checkbox o un
radio botón, y es una propiedad booleana, es decir, vale true si el objeto está
marcado y false si no lo está.
Propiedad name:
Es la propiedad que va a asignar a cada checkbox o radio un nombre
identificador para poder referirnos luego a él y acceder a sus
propiedades. La diferencia entre ambos tipos es que en el caso de un
grupo de radio botones todos deben tener el mismo name, ya que si no
es así el efecto de selección única se pierde.
Propiedad type:
Esta propiedad se refiere al tipo de objeto al que nos referimos en este caso
Checkbox o Radio.
Propiedad value:
Esta propiedad asocia un valor a cada checkbox o radio.
Metodos Objeto Checkbox y Radio
Método blur:
Este método se activa cuando se deselecciona el objeto.
Método Focus
Este método se activa cuando se selecciona el objeto.
Método Click
Este método produce la selección de una opción en los ckeckbox
y la selección de una opción y la deselección de otra en los radio.
OBJETO SELECT
Este objeto representa una lista de opciones dentro de un formulario. Puede
tratarse de una lista desplegable de la que podremos escoger alguna (o
algunas) de sus opciones. Para incluir un select la sintaxis es la siguiente:
<select name="menu">
<option value="opcion1">música
<option value="opcion2">cine
<option value="opcion3">teatro
<select>
Propiedades Objeto Select
Propiedad disable:
Esta propiedad bloquea el objeto de tal forma que no se puede
accionar el mismo.
Propiedad length:
Esta propiedad nos da acceso al número de opciones que forman
el combo.
Propiedad name:
Esta propiedad que va a asignar a cada select un nombre
identificador para poder
referirnos luego a él y accede a sus propiedades.
Propiedad type:
Esta propiedad se refiere al tipo de objeto al que utilizamos en
este caso Select.
Propiedad value:
Esta propiedad asocia un valor a cada opción <OPTOPN> de
select.
Métodos Objeto Select
Metodo blur:
Este metodo se activa cuando se deselecciona el objeto.
Metodo Focus
Este metodo se activa cuando se selecciona el objeto.
Objeto String
Este objeto nos permite hacer diversas manipulaciones con las cadenas, para
que trabajar con ellas sea más sencillo. Cuando asignamos una cadena a una
variable, JavaScript está creando un objeto de tipo String que es el que nos
permite hacer las manipulaciones.
METODOS DEL OBJETO STRING
Método charAt(índice):
Extrae un caracter representado por el índice especificado.
Índice está entre 0 y length-1.
Método indexOf(carácter)
Devuelve el índice de la primera ocurrencia del carácter.
También se le puede especificar el lugar por el que se quiere que
empieze a buscar.
Método lastIndexOf(cadena de caracteres)
Devuelve la última ocurrencia de la cadena de caracteres.
Método substring(principo,fin)
Extrae una cadena de caracteres entre un valor de
índice inicial y otro final.
Método toLowerCase()
Transforma una cadena de caracteres en minúsculas.
Método toUpperCase()()
Transforma una cadena de caracteres en mayúsculas.
Propiedad length()
Valor numérico que nos indica la longitud en caracteres de la
cadena dada.
Método concat(cadena1,cadena2)
Método que concatena dos cadenas.
Metodo split(separador)
Este método sólo es compatible con javascript 1.1 en adelante.
Sirve para crear un vector a partir de un String en el que cada elemento es la
parte del String que está separada por el separador indicado por parámetro.
Objeto Math
El objeto Math predefinido posee atributos y métodos asociados a las
constantes y funciones matemáticas
METODOS DEL OBJETO MATH
Atibuto Math.PI:
Constante matemática que representa al número PI. Su valor es
3.1416...
Metodo Math.abs(numero):
Devuelve el valor absoluto del número pasado por parámetros.
Metodo Math.asin(numero):
Devuelve el arco seno del número pasado por parámetros.
Metodo Math.acos():
Devuelve el arco coseno del número pasado por parámetros.
Metodo Math.atan():
Devuelve la arco tangente del número pasado por parámetros.
Metodo Math.sin(numero):
Devuelve el seno del número pasado por parámetros.
Metodo Math.cos():
Devuelve el coseno del número pasado por parámetros.
Metodo Math.tan():
Devuelve la tangente del número pasado por parámetros.
Metodo Math.sqrt(numero):
Devuelve la raíz cuadrada del número pasado por parámetros.
Metodo Math.log(numero):
Metodo Math.pow(base,exponente):
Devuelve el resultado de elevar la base al exponente.
Metodo Math.random():
Devuelve el valor aleatorio entre cero y uno.
Metodo Math.round(numero):
Redondeo inferior.
Objeto Date
El lenguaje JavaScript no posee variables tipo fecha, pero el objeto predefinido
Date permiten la manipulación de datos que representen fechas. Este objeto no
posee propiedades pero posee un número importante de métodos que
permiten su actualización, la obtención y la manipulación de fechas.
Se utilizará la sintaxis siguiente para crear un objeto de tipo de Date:
NombreVariable = new Date(parámetros)
Donde NombreVariable es el nombre de la variable en JavaScript que
representa al objeto
creado, que va a contener la fecha actual.
hoy = new Date();
Metodos del Objeto Date
Metodo GetDay
Devuelve el día de la semana de 0 (domingo) a 6 (sábado).
Metodo GetDate
Asigna el día del mes, donde número será un valor entre 1 y 31.
Metodo GetMonth()
Devuelve el mes de un objeto Date. La salida es un valor entero entre
Metodo GetHours()
Devuelve la hora de 0 a 23.
Metodo GetMinutes()
Devuelve los minutos de 0 a 59.
Metodo GetSeconds()
Devuelve los segundos de 0 a 59.
Metodo toLocaleString
Convierte una fecha al formato local.
Objeto Array
Metodos del objeto Array
Metodo array.length()
Este metodo nos permite conocer el numero de elementos que va
a tener un vector.
Metodo Push('Ultimo'):
Este metodo nos permite colocar un elemento en la ultima
posicion del vector.
Ejem: rray.push('uno');
Metodo Pop('Ultimo'):
Se elimina del vector el elemento que se encuentra en la ultima
posicion.
Ejem: array.pop();
Metodo shift('Primero'):
Se elimina del vector el elemento que se encuentra en la
primera posicion.
Ejem: array.unshift();
Metodo unshift('Primero'):
Se ingresa en la primera posicion del vector
Ejem: array.shift('uno');
Metodo join(':'):
Este nos permite colocar todos los elemntos de un vector en una
variable string.
Ejem:
x=array.join(':'); x="primero:rojo:verde:azul"
Metodo reverse():
Invierte las posiciones de el vector.
Ejem: array.reverse();
Metodo sort():
Ordena el vector de forma ascendente
Ejem:array.sort();
Metodos Globales
Estos métodos no pertenecen a ningún objeto en especifico los que
anunciaremos a continuación:
Método DE Eval()
Evalúa una cadena y calcula la operación que debe hacer.
Solo se permite las operaciones básicas.
Método IsNaN(valor)
Retorna true o false dependiendo si es número retorna false
y si no lo es retorna true.
Método parsefloat(valor)
Convierte una string a un número en punto flotante. Si se
encuentra otros caracteres que no sean números, el signo '+', el '-' o un
exponente, devuelve el valor encontrado hasta ese punto. Del mismo modo,
si el primer carácter no se puede convertir a número devolverá cero.
Método de parseInt(valor)
Convierte una cadena de caracteres de entrada a un número entero
con una base especificada.
Si se encuentra otros caracteres que no sean números, el signo '+', el '-'
o un exponente devuelve el valor encontrado hasta ese punto. Del mismo
modo, si el primer carácter no se puede convertir a número devolverá cero.
Estilos con JavaScript
Al utilizar hojas de estilo existía una limitación, en la cual no podíamos
cambiar dichos estilos en tiempo de ejecución, ahora utilizando JavaScript lo
podemos hacer.
Así para dar estilo a una pagina vamos a utilizar style así como indicaremos a
continuación.
<select name="menu">
<body id=cuerpo style=" color:blue; ">
<DIV id=caja1 style="BORDER-RIGHT: #000000 1px;
BORDER-TOP: #000000 1px;
FONT-SIZE: 10px;
BORDER-LEFT: #000000 1px;
WIDTH: 761px;
BORDER-BOTTOM: #000000 1px;>
</DIV>
Cuando queremos modificar los estilos de manera dinámica con funciones
JavaScript tenemos que
utilizar el metodo getElementById(id) que pertenece al objeto document,
cuya función es
devolver el nodo Elemento cuyo id es Identificador.
por ejem:
<body id="fondo"> <body>
<input type="button" value="cambiar letra" onclick="letras(color,'fondo');">
De esta manera si queremos modificar los estilos solo debemos mandar el id
del elemento y se cambiara en tiempo de ejecución
Debemos tomar en cuenta que la sintaxis en java es distinta a la que
utizabamos en hojas por lo que mostraremos sus respectivas
correspondencias.
Correspondencia entre propiedades CSS y propiedades DOM
Propiedad CSS
background
background-attachment
background-color
background-image
background-position
background-repeat
border
border-color
border-style
Propiedad DOM en Javascript
background
backgroundAttachment
backgroundColor
backgroundImage
backgroundPosition
backgroundRepeat
border
borderColor
borderStyle
border-top
border-right
border-left
border-bottom
border-top-color
border-right-color
border-bottom-color
border-left-color
border-top-style
border-right-style
border-bottom-style
border-left-style
border-top-width
border-right-width
border-bottom-width
border-left-width
border-width
clear
clip
color
display
float
font
font-family
font-size
font-style
font-variant
font-wight
height
left
letter-spacing
line-height
list-style
list-style-image
list-style-position
list-style-type
margin
margin-top
margin-right
margin-bottom
margin-left
overflow
padding
padding-top
padding-right
padding-bottom
padding-left
position
text-aling
text-decoration
text-indent
text-transform
top
vertical-align
borderTop
borderRight
borderLeft
borderBottom
borderTopColor
borderRightColor
borderBottomColor
borderLeftColor
borderTopStyle
borderRightStyle
borderBottomStyle
borderLeftStyle
borderTopWidth
borderRightWidth
borderBottomWidth
borderLeftWidth
borderWidth
clear
clip
color
display
cssFloat
font
fontFamily
fontSize
fontStyle
fontVariant
fontWight
height
left
letterSpacing
lineHeight
listStyle
listStyleImage
listStylePosition
listStyleType
margin
marginTop
marginRight
marginBottom
marginLeft
overflow
padding
paddingTop
paddingRight
paddingBottom
paddingLeft
position
textAling
textDecoration
textIndent
textTransform
top
verticalAlign
visibility
white-space
width
word-spacing
z-index
visibility
whiteSpace
width
wordSpacing
zIndex