Fundamentos de páginas web dinámicas en el cliente con javascript

I. OBJETIVOS Que el estudiante: • Adquiera dominio de los elementos sintácticos básicos del lenguaje JavaScript • Incluir código JavaScript en un documento HTML 5 por medio de un documento .js • Sea capaz de generar código HTML 5 desde secuencias de comando de JavaScript • Pueda crear páginas web utilizando métodos básicos de interacción con el usuario • Utilice métodos básicos de depuración descripts utilizando las herramientas del navegador II. INTRODUCCION TEORICA Introducir código JavaScript dentro de un documento HTML Existen cuatro formas de agregar código JavaScript dentro de un documento web. Estas son: • Utilizando el elemento script Este es el método básico para incluir código JavaScript dentro de HTML. Los navegadores que reconocen scripts suponen que todo texto incluidodentro de estas etiquetas tiene que interpretarse como alguna forma de lenguaje de scripts. Casi todos suponen por defecto, que se trata de código JavaScript. Tradicionalmente la forma de indicar el lenguaje en un elemento script es haciendo uso del atributo language. De la siguiente forma: //Sentencias JavaScript De acuerdo con el consorcio W3C en lugar del atributo language, debería utilizarse elatributo type para indicar el tipo MIME del lenguaje en uso. El tipo MIME de JavaScript es "text/javascript". De acuerdo a esta recomendación debería hacerse uso del siguiente código: //Sentencias JavaScript

• Creando scripts .js y vincularlos al documento con el elemento script Esta es la solución ideal cuando se tienen códigos de script de muchos cientos de líneas o cuando se creanfunciones JavaScript que pueden llegar a utilizarse en varias páginas. En esto casos incluir todo este código dentro de elementos script puede resultar poco productivo e ineficiente. En estos casos es más conveniente crear el script en un archivo .js independiente y luego vincularlo al documento HTML mediante el atributo src del elemento script. Consideraciones a tener en cuenta al utilizar este método:El archivo debe emplear formato de sólo texto Debe ser almacenado con extensión .js. Si utiliza un procesador de texto o un editor de texto asegúrese de que realmente fue guardado con esa extensión. No debe emplear el elementos script dentro del código JavaScript creado en el archivo .js La forma sintáctica es la siguiente: Es importante recordar que script es un elemento HTML cerrado, por tantodebe ir acompañado con su respectiva etiqueta de cierre para que funcione correctamente. Esta es la forma en que codificaremos durante los ejemplos y ejercicios de las guías de práctica de este curso. • Empleando atributos HTML conocidos como manejadores de evento La forma de crear páginas web interactivas es el uso de manejadores de eventos. Esto permite responder al usuario desde la página webcomo respuesta a las acciones que realiza en la página. Acciones como hacer clic sobre un botón del ratón, presionar una tecla, apuntar con el ratón a algún objeto específico en la página, etc. La forma más usual de aplicar manejadores de eventos en una página es con atributos de ciertos elementos HTML. Algunos ejemplos de estos atributos son: onclick, onmouseover, onchange, onkeypress, etc. Puedeobservar el siguiente ejemplo simple: • Haciendo uso de sintaxis de dirección pseudos-URL (javascript:) Una dirección pseudos-URL permite crear instrucciones especiales con código JavaScript que es posible invocar desde la barra de direcciones del navegador. Sintácticamente estas direcciones comienzan con javascript: y a continuación se pueden agregar instrucciones JavaScript sintácticamente bienescritas. Por ejemplo: javascript:alert('Hola, APS I'); Las pseudos-URL se pueden utilizar en enlaces como valor para el atributo href y de esta forma ejecutar varias instrucciones a la vez. Como puede verse en el siguiente ejemplo: Sumar Ejemplos: Los siguientes ejemplos ilustran cómo insertar código de JavaScript de cada una de las formas mencionadas anteriormente:
Utilizando etiquetas …...