TRABAJO DE JAVASCRIPT

PRESENTADO POR:

PRESENTADO A:

MATERIA

COLEGIO SANTIAGO DE CALI ABRIL 11 DE 2012

TRABAJO DE JAVASCRIPT

PRESENTADO POR:

PRESENTADO A:

MATERIA

COLEGIO SANTIAGO DE CALI ABRIL 11 DE 2012

PAGINA DE ACEPTACION

NOTA DE ACEPTACION

_____________________________________ _____________________________________ _____________________________________ _____________________________________ _____________________________________

____________________________________ PROFESOR

FECHA:

CONTENIDO

PAG INTRODUCCION - - - -- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

HISTORIA - - - -- - - - - - -- - - - - -- -- - - -- -- - -- - - - - - - - - - - - --- --

EJEMPLOS - - - -- - - - - -- - - - - - - -- - - - - - -- - - - - - - - - - -- - - - - - -

CONCLUCION - - -- - - - - - - - -- - - - - - - - - - - - - - - - -- - - - - - - - - - -

PRESENTACION

Este documento fue Redactado, con una margen de 4 cm a la izquierda, 2cm a la derecha, 3 cm al lado superior y 3 cm al lado inferior, con una fuente arial y tamao de la letra en 12 con interlineados de 1,5. Ttulos con negrilla, subrayado y mayscula sostenida

JavaScript

Es

un lenguaje

de

programacin

interpretado,

dialecto

del

estndar ECMAScript. Se define como orientado a objetos, basado en prototipos, imperativo. Se utiliza principalmente en su forma del lado del cliente (client-side), implementado como parte de un navegador web permitiendo mejoras en la interfaz de usuario y pginas web dinmicas, en bases de datos locales al navegador. JavaScript se dise con una sintaxis similar al C, aunque adopta nombres y convenciones del lenguaje de programacin Java. Sin

embargo Java y JavaScript no estn relacionados y tienen semnticas y propsitos diferentes. Es compactible con HTML y en los ejemplos vamos a ver como cabecera cdigos de la librera del HTML.

HISTORIA JavaScript fue desarrollado originalmente por Brendan Eich de Netscape con el nombre de Mocha, el cul fue renombrado posteriormente a LiveScript, para finalmente quedar como JavaScript. El cambio de nombre coincidi aproximadamente con el momento en que Netscape agreg soporte para la tecnologa Java en su navegador web Netscape Navigator en la versin 2.003 en diciembre de 1995. La denominacin produjo confusin, dando la impresin de que el lenguaje es una prolongacin de Java, y se ha caracterizado por muchos como una estrategia de mercadotecnia de Netscape para obtener prestigio e innovar en lo que eran los nuevos lenguajes de programacin web. JavaScript es una marca registrada de Oracle Corporation. Es usada con licencia por los productos creados por Netscape Communications y entidades actuales como la Fundacin Mozilla.

Microsoft dio como nombre a su dialecto de JavaScript JScript, para evitar problemas relacionados con la marca. JScript fue adoptado en la versin 3.0 de Internet Explorer, liberado en agosto de 1996, e incluy compatibilidad con el Efecto 2000 con las funciones de fecha, una diferencia de los que se basaban en ese momento. Los dialectos pueden parecer tan similares que los trminos JavaScript y JScript a menudo se utilizan indistintamente, pero la especificacin de JScript es incompatible con la de ECMA en muchos aspectos. Para evitar estas incompatibilidades, el World Wide Web Consortium dise el estndar Document Object Model (DOM, o Modelo de Objetos del Documento en espaol), que incorporan Konqueror, Navigator, Opera la las versin versiones 6 de Internet Application

Explorer y Netscape

7, Mozilla

Suite y Mozilla Firefox desde su primera versin.

En 1997 los autores propusieron JavaScript para que fuera adoptado como estndar de la European Computer Manufacturers 'Association ECMA, que a pesar de su nombre no es europeo sino internacional, con sede en Ginebra. En junio de 1997 fue adoptado como un estndar ECMA, con el nombre de ECMAScript. Poco despus tambin como un estndar ISO.

Ejemplo1 Este primer ejemplo es sobre los operdores aritmeticos los cuales son muy comunes y se utilizan mucho en la programacion orientada a objeto, como se puede observar los cabezales son de codigo HTML y luego continua con codigos de JavaScript, para iniciar un comando en JavaScript hay que iniciar con el operador menor que (<) el cual indica que hemos abierto el comando para escribir, desde ah partimos en nuestra programacion.Para cerrar el comando lo hacemos con el operador mayor que (>), estos permiten que cualquier texto que pongamos en los comandos los tome como si fueran de la
7

librera de JavaScript o si esta por fuera no lo toma o no lo reconoce como un comando de la librera de JavaScript. Este ejemplo hace la diferenciacion de los operadores aritmeticos, tomando como referencia a dos letras que son la (a y b) a las cules se le asigna un valor para poder hacer la diferenciasion de los distintos operadores.En este caso particular, se ha utilizado document.Write, una de las funciones ms importantes de JavaScript, que permite escribir algo en el documento actual

fig .#1

En este siguiente pantallazo vemos la continuacin de los operadores aritmticos pero con condiciones, los cuales hacen referencia a condiciones ms o menos esto quiere decir aumenta o disminuye un valor que le

asignemos a una variable,

fig .#2 El prximo pantallazo se ven reflejados cdigos para hacer alertas (alert) estas son las ventanitas que encontramos cuando ingresamos a una pgina web mediante este alerta nos damos cuenta si nuestro registro en dicha pgina fue exitosa o fracaso.

fig .#3

fig .#4 En este ejemplo de los alertas se hace registro de cdigos ms complejos y se puede observar la concatenacin de varia informacin. En los siguientes alertas vemos podemos registrar datos por medio de una ventana, y podemos observar como los alertas nos validan la informacin que

fig .#5 Ingresamos

10

fig .#6

fig .#7

fig .#8 En los prximos pantallazos podemos observar restricciones utilizando alertas, concatenados a otras lneas de cdigos como lo son el (document o el write)
11

fig .#9 Si nos fijamos en la condicin que se ha puesto en los cdigos, podemos observar que las personas que tengan menos o igual de 16 aos pueden ingresar a mi fiesta, de lo contrario no.

fig .#10 Y este es el mensaje que nos sale Y los que tengan ms de 16 aos no pueden ingresar que es lo se puede observar en el pantallazo

12

fig .#11 de lo contrario bienvenido a mi fiesta

fig .#12

13

seguimos en los alertas para validacin de informacin, pero estos ya son con los conocidos llamados condicionales igual que el de arriba, este ejemplo es con (SWITCH, CASE) que quiere decir haga mientras se cumpla el caso:

fig .#13

fig .#14

14

fig .#15

fig .#16 As como lo ya se hizo con los meses tambin se puede hacer con los das de la semana.

fig .#17

15

Continuamos con un cdigo muy sencillo pero que impresiona y es como abrir una nueva ventana con base en cdigos. Cuando en nuestro editor de comandos le damos click en vista previa de una nos abre la nueva ventana y nos lleva a la direccin o URL que le hemos indicado por medio de los comandos.

fig .#18 como se puede observar esta es la nueva ventana que se abre cuando acionamos el script.

fig .#19

16

El lenguaje script fue desarrollado con unas lneas que hacen de la programacin un camino ms ligero y preciso, en el prximo pantallazo, podemos observar como dando click a un botn podemos convertir un texto de mayscula a minscula y viceversa.

fig .#20

fig .#21

17

fig .#22

En el

prximo pantallazo observaremos la creacin de

un formulario de

registro de usuarios es muy habitual que deseemos incluir un campo clave, que podra utilizarlo el usuario para acceder a los servicios de la web donde se est registrando o para actualizar ms adelante la informacin introducida.

Para realizar un formulario donde se escriba la clave, lo normal es que aparezcan dos campos donde introducir la misma clave y que el usuario que la introduzca est forzado a escribir la clave dos veces, siendo las dos claves introducidas iguales. Esto nos ayuda a que el usuario no se equivoque al escribir la clave por un fallo en la mecanografa, ya que es complicado que se equivoque dos veces en al escribir la clave.

Con JavaScript podemos hacer una comprobacin -en el cliente- para ver si se ha introducido la misma clave en los dos campos y, si es as, mandar el formulario al servidor o hacer aquellas acciones necesarias para continuar con el registro de ese visitante. En caso de que las dos claves sean distintas se debera informar al usuario de la situacin para que vuelva a introducir la clave deseada correctamente.

Comprobar

si

dos

campos

de

formulario

son

iguales

18

Es una accin bastante sencilla. Simplemente debemos extraer los dos valores guardados en los campos del formulario donde se ha escrito la clave y la repeticin de la clave.

Luego, con un condicional IF, podemos comprobar si estos dos datos son el mismo o no lo son, la respuesta a esta peticin nos llegara por medio de alertas que ya los habamos visto un poco atrs.

fig .#24

Si bien se puede observar en este pantallazo vemos de nuevo la lnea de cdigos document que por medio de ella logramos validar el dato de los dos campos y con la ayuda del alert que es el que nos informa si coinciden o no.

19

fig .#25

fig .#26

20

fig .#27

fig .#28

En JavaScript la funcionalidades hacen que la vida del programador como tal sea mas facil y menos compleja a la hora de desarrollar un programa. En el proximo pantallazo se puede observar como con una funcion y otros metodos

21

de la librera de JavaScript los ejercicios a desarrollar se hacen mas facil, en este ejemplo vemos los get combinados con las funcionalidades del tiempo como el Hours que nos muestra la hora ente (0 y 23), Minutes que nos

muestra los minutos de (0 al 59) y Seconds que nos muestra los segundos de (0 al 59)

fig .#29

fig .#30

22

Este proximo ejemplo, nos muestra de una manera sencilla como mostrar un alerta dando click cobre una texto, que es un link .

fig .#31

fig .#32

fig .#33

23

Aqu se ve un evento de loa librera de javascript que hace, cuando se mueve el cursor o mouse sobre el texto aparce un alert con un mensaje, el mensaje ya depende de ti.

fig .#34

fig .#35

24

fig .#36

Aqu se ve reflejado un codigo de la librera de javascript que es onMouseOver esta funcion lo que hace es realizar un evento sobre el texto cuando le pones el mouse, es casi similar a la anterior

fig .#37

25

fig .#38

fig .#39

26

fig .#40

fig .#41

27

RESUMEN

El objetivo de este trabajo es profundizar, afianzar y expresar el conocimiento sobre el tema en discusin, analizar las situaciones y obtener soluciones desde muchos puntos de vista, darme cuenta que la programacin en JavaScript no es una tortura degradante si no una manera de entender un poco el entorno y el funcionamiento de la web como tal. Es maravilloso ingresar a un sitio web y ver cmo te sorprendes con las cosas tan maravillosas, con las aplicaciones, el como con dar un click pasan cosas sorprendente.

La programacin en JavaScript te hace conocer el mundo divertido y colorido de la programacin. Es un lenguaje de programacin script con amplio soporte para navegadores y herramientas de desarrollo que permite la creacin de contenidos dinmicos en una pgina web.

JavaScript es un lenguaje que debido a potencia todo desarrollador debe conocer para mejorar sus pginas, adems por su sencillez incluso aquellas personas con menos experiencia y conocimientos en programacin van a poder aprenderlo en poco tiempo.

JavaScript es el lenguaje de secuencias de comandos estndar para todos los navegadores de Internet. El lenguaje de programacin JavaScript no necesita declarar los tipos de datos El cdigo de JavaScript es sensible a las maysculas y variables. minsculas.

28

 Los comandos JavaScript deben insertarse en el cdigo HTML por medio de un par de etiquetas <SCRIPT>. Es aconsejable colocar el cdigo JavaScript en la seccin HEAD de la pgina, a excepcin del cdigo asociado a la respuesta de eventos. Una instruccin SIEMPRE TERMINA CON UN PUNTO Y COMA ";" Los comentarios son lneas de cdigo que no se ejecutan.

29

GLOSARIO

ECMAScript Es una especificacin de lenguaje de programacin publicada por ECMA International. El desarrollo empez en 1996 y estuvo basado en el popular lenguaje JavaScript propuesto como estndar por Netscape Communications Corporation. Actualmente est aceptado como el estndar ISO 16262. ECMAScript define un lenguaje de tipos dinmicos ligeramente inspirado en Java y otros lenguajes del estilo de C. Soporta algunas caractersticas de la programacin orientado a objetos mediante objetos basados en prototipos y pseudo-clases.

pseudo-clases. First-child selecciona un elemento que es el primer hijo de otro

elemento. Por ejemplo, si queremos que un prrafo no tenga sangra cuando sea el primer hijo de un DIV: DIV > P:first-child {text-indent: 0} Note que entre p y:first-child no debe haber espacio, pero

entre DIV y > y P pueden o no quedar espacios intermedios.

link y : visited Por medio de estas dos pseudo-clases, podemos definir el estilo para los links que aparecen en nuestras pginas y otro estilo para esos links cuando ya han sido visitados. En HTML, dentro de la marca BODY tambin se puede especificar un color para los links y otro para los links visitados, pero con CSS se pueden cambiar muchos otros atributos.

30

hover, active, focus Estas son pseudo-clases dinmicas, ya que cambian en respuesta a las acciones del usuario. :hover se aplica cuando el cursor del mouse seala el elemento. :active se aplica cuando el elemento es activado (por ejemplo, cuando el usuario presiona el botn del mouse). :focus se aplica cuando el elemento recibe el foco.

Uno de los mayores desvelos de los diseadores de pginas Web han sido siempre los links y la manera de hacer que estos cambien de aspecto al ser sealados por el mouse. Con frecuencia, la solucin consista en utilizar dos imgenes que se cambiaban mediante JavaScript u otro lenguaje. Afortunadamente, con CSS podemos simplificar todo el proceso y obtener efectos muy variados en nuestros enlaces.

Normalmente, se utilizan las cuatro pseudo-clases siguientes para controlar el comportamiento de los links. A:link {color: red} A:visited {color: gray} A:hover {color: blue} A:active {color: fuchsia} Aqu especificamos un color rojo para los links, un color gris para los ya visitados, un color azul cuando es sealado y un fucsia cuando es activado. Se debe tener en cuenta que, por las reglas de cascada, el orden en que deben ser especificadas estas cuatro pseudo-clases para que funcionen correctamente es el que se ha usado en el ejemplo.

31

Lang :En HTML es posible especificar el idioma que se usa en un elemento mediante el atributo lang. Por ejemplo, para identificar que un prrafo est en francs se usa: <P lang:"fr"> El cdigo para identificar el idioma consta generalmente de dos letras: "es" espaol, "en" ingls, "de" alemn, "fr" francs, etc. Mediante la pseudo-clase :lang podemos seleccionar elementos en base a su idioma. Como cada idioma tiene sus propias convenciones con respecto al formato (uso de itlicas, sangras o comillas, por ejemplo), esta pseudoclase nos permite describir cmo debe aparecer un elemento segn el idioma usado. La siguiente regla especifica el tipo de comillas que debe usar un elemento Q en francs: Q:lang(fr) { quotes: ' ' ' ' } document. Write. Es una de las funciones ms importantes de JavaScript, que permite escribir algo en el documento actual.

32

BIBLIOGRAFIA
http://es.wikipedia.org/wiki/JavaScript

33

INTRODUCCION

JavaScript es un lenguaje de programacin orientada a objeto (POO), el cual nos permite interactuar con la web, por medio de pginas basadas en cdigos y en conjunto con HTML.

JavaScript es el lenguaje funcional ms popular del mundo. JavaScript es y siempre ha sido, al menos desde la versin 1.2, un lenguaje de programacin funcional."

34

CONCLUCION

Para finalizar con este trabajo podemos decir en breve que el JavaScript nos lleva a un mundo donde las cosas, irreales se vuelven reales, y lo no imaginado se hace realidad programar en este lenguaje nos conecta con un mundo diferente y nos hace entender la manera de funcionar de la web y el cmo puede avanzar la comunicacin entre un computador y el ser humano. En conclusin se iz un resumen sobre lo productivo y bueno que es el

JavaScript y sus funcionalidades, se iz un resumen de las funciones, los arreglos y la manera en que facilita la vida de un programador

35