Javascript

Loading...

Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

0 comments

Post a comment

    Post a comment
    Embed Video
    Edit your comment Cancel

    Notes on slide 1

    Favorites, Groups & Events

    Javascript - Presentation Transcript

    1. Laboratorio N° 3 pacd1985
      • Es un lenguaje para crear scripts. Es el más conocido y es soportado por la mayoría de browsers. Ej: IE, Firefox, Opera.
      • Un script es un conjunto de instrucciones que permite la automatización de una tarea creando pequeñas utilidades.
      • Fue diseñado para añadir interactividad a páginas HTML. Ej: Eventos.
      • Es un lenguaje de programación ligero y se ejecuta en la máquina cliente.
      • Algunos ejemplos de aplicación son: validación de formularios y detección de browsers.
      • Es usualmente embebido directamente en las páginas HTML.
      • Es un lenguaje interpretado.
      • No se necesita licencia para usarlo.
      • NO TIENE NADA QUE VER CON JAVA.
      • Puede leer y escribir elementos HTML.
      • Puede poner texto dinámico en un HTML.
      • Puede validar data.
      • Puede detectar el browser del visitante.
      • Puede crear cookies.
      • <html>
      • <head>
      • …
      • </head>
      • <body>
      • <script type=&quot;text/javascript&quot;> document.write(“Soy un javascript&quot;);
      • </script>
      • </body>
      • </html>
      • Los browsers que no soportan el HTML desplegar án el javascript como contenido; así que se suele colocar el script como un comentario HTML.
      • <script type=&quot;text/javascript&quot;>
      • <!–
      • document.write(&quot;Hello World!&quot;);
      • -->
      • </script>
      • El Javascript en el body se ejecutará mientras la página carga.
      • El Javascript en el head se ejecutará cuando sea llamado.
      • <head>
        • <script type=&quot;text/javascript&quot;>
        • ....
        • </script>
      • </head>
      • El Javascript también puede encontrarse en un archivo externo, esto favorece la reutilización de código.
      • Un archivo Javascript externo no contiene los tags <script> .
      • Un archivo Javascript externo tiene la extensión “.js”.
      • Para usar un script externo, se apunta al recurso en el atributo src del tag <script> .
        • <script type=&quot;text/javascript&quot; src=&quot;xxx.js&quot;>
        • </script>
        • Este se coloca donde normalmente se escribiría el script en el HTML, en el head o en el body.
      • Se puede usar la etiqueta <noscript> para mostrar un mensaje al usuario cuando el navegador no puede ejecutar JavaScript.
      • Se debe incluir en el interior de la etiqueta <body> (normalmente se incluye al principio de <body>) y el mensaje que muestra <noscript> puede incluir cualquier elemento HTML.
      • <noscript>
      • <p>Bienvenido a Mi Sitio</p>
      • <p>La página que estás viendo requiere para su funcionamiento el uso de JavaScript.
      • Si lo has deshabilitado intencionadamente, por favor vuelve a activarlo.</p>
      • </noscript>
      • Javascript es Case Sensitive.
      • Se coloca un “;” al final de cada declaración.
      • Cada declaración será ejecutada por el browser según el orden en que están.
      • Los comentarios pueden ser de una línea
      • ( // … ) o multi-líneas ( / * … */ ).
      • Los nombres deben empezar con una letra o con el carácter “ _ ”.
      • Se declaran variables con la palabra reservada “ var ”.
      • var x;
      • var nombre_alumno;
      • Se pueden asignar valores en la misma declaración. Por ej: var x = 5;var nom=“yo”;
      • Si se asignan valores a variables que no han sido declaradas, estas serán automáticamente declaradas.
      • La concatenación se hace utilizando el operador “ + ”.
      • Los operadores de comparaci ón son “ == “, “ != “, “ > ”, “ < “, “ >= “ y “ <= “.
      • Los operadores lógicos son:
          • && -> and
          • || -> or
          • ! -> not
      • Las declaraciones condicionales son:
          • If
          • If else
          • If else if
          • switch
      • <script type=&quot;text/javascript&quot;>
        • /* Escribe “Buenas tardes” si es más de las 12 pero menos de las 7 */
        • var d=new Date();
        • var time=d.getHours();
        • if ((time > 12) && (time < 19))
        • {
        • document.write(&quot;<b>Buenas Tardes</b>&quot;);
        • }
      • </script>
      • Sirven para describir cadenas de carateres para comparaciones o reemplazos complejos.
      • Algunos ejemplos sencillos son:
          • /ingeniero/
          • /ingenier [oa]/
          • /ingenier[0-9]/
          • /ingenier[0-9a-z]/
      • Un ejemplo m ás complejo sería:
      • /^([0-9a-zA-Z]([-.w]*[0-9a-zA-Z])*@([0-9a-zA-Z][-w]*[0-9a-zA-Z].)+[a-zA-Z]{2,9})$/
      • Esta expresión regular representa la estructura de una dirección de email.
      • Javascript te permite crear tus propios objetos, pero ya tiene objetos creados.
      • Por ejemplo, utilicemos la propiedad length del objeto String para hallar su n úmero de caracteres.
      • <script type=&quot;text/javascript&quot;>
      • var txt=&quot;Hello World!&quot;;
      • document.write(txt.length);
      • </script>
      • Ahora, utilicemos el método toUpperCase() del objeto String para desplegar su texto en mayúsculas.
      • <script type=&quot;text/javascript&quot;>
      • var str=&quot;Hello world!&quot;; document.write(str.toUpperCase());
      • </script>
      • Es un estándar de la W3C que define un conjunto de objetos para acceder y manipular documentos HTML.
      • DOM presenta un documento HTML como una estructura de nodos, con elementos, atributos y texto.
    23.  
      • Para DOM, todo en un documento HTML es un “nodo”.
      • Algunas propiedades típicas de DOM:
        • x.innerHTML – El texto interno del elemento x
        • x.nodeName – El name del elemento x
        • x.nodeValue – El value del elemento x
        • x.parentNode – El nodo padre del elemento x
        • x.childNodes – Los nodos hijo del elemento x
        • x.attributes – Los nodos atributo del elemento x
      • Algunos métodos típicos de DOM son:
        • x.getElementById(id) – Obtiene el elemento con ese id
        • x.getElementsByTagName(name) – Obtiene los elementos con ese name
        • x.appendChild(node) – Inserta un nodo hijo a x
        • x.removeChild(node) – Remueve un nodo hijo de x.
      • Ahora veamos un ejemplo:
      • <html>
      • <head>
      • …
      • </head>
      • <body>
      • <p id=&quot;intro&quot;>Hola!</p>
      • <p id=&quot;main&quot;>Este es un ejemplo.</p>
      • <script type=&quot;text/javascript&quot;>
      • txt=document.getElementById(&quot;intro&quot;).innerHTML;
      • document.write(“El texto de intro: &quot; + txt);
      • </script>
      • </body>
      • </html>
    27.  
      • Sirve para validar la data de los inputs antes de que sean enviadas al servidor. Por ejemplo:
        • ¿Campos obligatorios vacíos?
        • ¿El email es válido?
      • Se utiliza principalmente por dos razones: Evitar recargar de peticiones innecesarias al servidor y agilizar la interactividad de la página.
    SlideShare Zeitgeist 2009

    + Piero Angelo Cáceres DiazPiero Angelo Cáceres Diaz Nominate

    custom

    472 views, 0 favs, 1 embeds more stats

    Javascript, regular expressions, DOM and some valid more

    More info about this document

    © All Rights Reserved

    Go to text version

    • Total Views 472
      • 471 on SlideShare
      • 1 from embeds
    • Comments 0
    • Favorites 0
    • Downloads 11
    Most viewed embeds
    • 1 views on http://localhost

    more

    All embeds
    • 1 views on http://localhost

    less

    Flagged as inappropriate Flag as inappropriate
    Flag as inappropriate

    Select your reason for flagging this presentation as inappropriate. If needed, use the feedback form to let us know more details.

    Cancel
    File a copyright complaint
    Having problems? Go to our helpdesk?

    Categories

    Tags

    -->
    What's New

    © 2009 SlideShare Inc. All rights reserved.