JavaScript: Introducción - Dpto. Ciencias de la Computación e

Anuncio
JavaScript: Introducción
Francisco J. Martı́n Mateos
Carmen Graciani Diaz
Dpto. Ciencias de la Computación e Inteligencia Artificial
Universidad de Sevilla
Metodologı́a de la Programación
JavaScript: Introducción
¿Qué es JavaScript?
JavaScript es un lenguaje de programación interpretado
utilizado en páginas Web
Fué desarrollado para el navegador Netscape Navigator 2.0
Todos los navegadores modernos interpretan el código
JavaScript integrado dentro de las páginas Web
Metodologı́a de la Programación
JavaScript: Introducción
¿Para qué sirve JavaScript?
El código JavaScript se ejecuta en el navegador al tiempo que
las sentencias van descargándose junto con el código HTML
Aplicaciones:
Generar partes de un documento de forma dinámica
Insertar aplicaciones en documentos HTML que no necesitan
de comunicación con el servidor
Modificar un documento HTML en función de la interacción
del usuario
Metodologı́a de la Programación
JavaScript: Introducción
¿Qué se puede hacer con JavaScript?
Calculadora simple
Calculadora compleja:
http://www.motionnet.com/calculator/
Texto que se desliza
Reloj digital
Degradado de color
Mini juegos
Se pueden encontrar múltiples aplicaciones en Internet
Metodologı́a de la Programación
JavaScript: Introducción
¿Dónde y cómo incluir JavaScript en un documento?
JavaScript se puede incluir en cualquier punto de un
documento HTML, o todo aquel que termine traduciéndose
en HTML en el navegador del cliente (PHP, ASP)
El código JavaScript se puede incluir tanto en la cabecera
como en el cuerpo del documento
Formas de incluir código JavaScript:
JavaScript en lı́nea en el documento HTML
JavaScript en lı́nea desde un fichero externo
JavaScript en respuesta a un evento
El resultado de la evaluación de código JavaScript no aparece
nunca en el documento HTML, salvo que se incluya de forma
explı́cita
Metodologı́a de la Programación
JavaScript: Introducción
JavaScript en lı́nea en el documento HTML
El código JavaScript en lı́nea va inscrito entre las etiquetas
HTML <SCRIPT> y </SCRIPT>
Este código se ejecuta en el momento en que el navegador
procesa la parte del documento HTML donde se encuentra el
código
No conviene utilizar JavaScript en lı́nea con referencias a
elementos del documento posteriores al propio código
JavaScript, ya que cuando éste se procesa dichos elementos
no existen
JavaScript en lı́nea
<SCRIPT>
document.write("Hola a todos")
</SCRIPT>
Inclusión explı́cita de texto en un documento HTML:
document.write
Metodologı́a de la Programación
JavaScript: Introducción
JavaScript en lı́nea desde un fichero externo
Se comporta como el JavaScript en lı́nea en el documento
HTML salvo que el código se encuentra en un fichero externo
El URI del fichero que contiene el código se indica como valor
del atributo src de la etiqueta <SCRIPT>
A pesar de no contener código, es necesario incluir la etiqueta
final </SCRIPT>
El fichero referenciado no debe contener las etiquetas
<SCRIPT> ni </SCRIPT>
JavaScript desde un fichero
<SCRIPT src="saludo.js"></SCRIPT>
Metodologı́a de la Programación
JavaScript: Introducción
JavaScript en respuesta a un evento
Ciertos elementos HTML son sensibles a eventos:
movimientos del ratón, pulsaciones sobre botones, ...
Se puede incluir código JavaScript que actúe en respuesta a
dichos eventos
Este código se ejecuta cuando se genera el evento y no en el
momento de cargar la página HTML
Esta forma de incluir código JavaScript permite modificar un
documento HTML en función de la interacción del usuario
JavaScript en respuesta a un evento
<BODY onLoad="window.alert(’Hola una vez más’)">
Ventana de avisos: window.alert
Metodologı́a de la Programación
JavaScript: Introducción
Descargar