2. Agenda
• ¿Qué es Javascript?
• (JS == Java)
• Propósitos de JS
• Hola Mundo
• Dónde introducir código Javascript
• Comentarios Javascript
• Variables
• Operadores
• Estructuras de Condición
• Manejo de Popups
• Funciones
• Estructuras de Iteración
• Eventos
3. ¿Qué es Javascript?
• El nombre original es ECMAScript
• Diseñado para añadir interactividad a
las páginas HTML
• integrado directamente en páginas HTML
• JavaScript es un lenguaje interpretado
5. Propósitos de Javascript
• Javascript ofrece a los diseñadores una
herramienta de programación HTML
• Texto dinámico en una página HTML
• Captura de Eventos
• Validar los datos
• Crear cookies
• Entre muchas otras funciones
20. Funciones
• En Javascript, las funciones presentan un
comportamiento similar al del resto de los lenguajes:
• También es posible retornar valores, de la manera Java, C o C++
24. Eventos
• Javascript es capaz de detectar y manejar
eventos relacionados con elementos de
una página WEB
• Cada elemento de una página WEB tiene
una serie de eventos que pueden ser
manejados vía JS:
Clic de mouse
Carga de página
Pasar el mouse por algún punto
Seleccionar algún campo de formulario
Enviar un formulario al servidor
Teclear un botón
Entre otros
25. Eventos
• onLoad y onUnload
Este evento se disparan cada vez que el
usuario entra o sale de la página
26. Eventos
• onFocus, onBlur y onChange
Son usados en combinación con validaciones
de entrada
<input type="text" size="30" id="email" onchange="checkEmail()">
27. Eventos
• onSubmit
Este evento se dispara cuando se requiere
validar todos los campos de un formulario
antes de enviarlo
<form method="post" action="xxx.htm" onsubmit="return checkForm()">
28. Eventos
• onMouseOver y onMouseOut
Generalmente para generar animaciones y
comportamiento relativo al mouse, en
interacción con elementos de la página WEB
<a href="http://www.w3schools.com" onmouseover="alert('An onMouseOver
event');return false"><img src="w3s.gif" alt="W3Schools" /></a>
29. Síntesis
• Se conocieron los fundamentos de
Javascript como lenguaje del cliente
• Será necesario poner en práctica cada uno
de los ítems anteriores
• Se sugiere el seguimiento del sitio de
entrenamiento de W3.
30. Recursos
The Acid3 Test: http://acid3.acidtests.org/
The Javascript and HTML DOM Reference :
http://www.w3schools.com/jsref/default.asp
Javascript Introduction : http://www.w3schools.com/js/js_intro.asp