Scribd Logo
Upload

Welcome to Scribd!

  • 04 Javascript Objetos y Ejemplos1

    Uploaded by

    Adiel Miranda Martinez
    16 views20 pages

    Copyright

    © Attribution Non-Commercial (BY-NC)

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    16 views20 pages

    04 Javascript Objetos y Ejemplos1

    Uploaded by

    Adiel Miranda Martinez

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 20

    JAVASCRIPT

    Objetos y ejemplos

    Programacin Orientada a Objetos (POO)

    La programacin orientada d a objetos b se considera d software a travs de una conjunto de objetos que cooperan. cooperan Cada objeto es capaz de recibir mensajes, procesar datos y enviar mensajes a otros objetos. objetos Cada objeto puede verse como una pequea mquina independiente con un papel o responsabilidad definida. El cdigo orientado al objetos est concebido para ser ms fcil de desarrollar y ms fcil de entender posteriormente.

    Objetos del Lenguaje

    Math
    max(x,y)

    o min(x,y): Devuelve el mximo o el mnimo de 'x' e 'y. random(): Devuelve un nmero aleatorio entre 0 y 1.

    Date
    getDate():

    Da del mes getDay(): Da de semana getHours() tH (): Horas H getMinutes(): Minutos


    getMonth():

    getSeconds(): Segundos getYear(): Ao

    Mes

    Ejemplo Ej l <script>var d=new Date(); document.write(d);</script> /

    Objetos creados automticamente (I)

    Cada vez que se carga una pgina en el navegador se crea automticamente una serie de objetos que pueden ser usados al programar en JavaScript. Window: es el objeto principal del cual "cuelgan" los dems. Se crea un objeto de este tipo para cada ventana que pueda ser lanzada desde una pgina Web. Navigator: contiene informacin acerca del navegador, tal como nombre, b versin, i tipos i MIME y plugs-in l i instalados. i l d Location: con informacin acerca del URL que estemos visualizando. Hi t : historial History hi t i l en el l que se guardan d los l URL ya visitados. i it d Document: es el contenedor de todos los objetos que se hayan insertado en la pgina web: enlaces, enlaces formularios, formularios imgenes o marcos

    Objetos creados automticamente (II)


    Cada objeto que incluyamos en la pgina ser una propiedad del objeto document. C d vez que se desea Cada d acceder d a una propiedad i d d o un mtodo de un objeto, hemos de detallar cuales son sus padres mediante el uso de puntos.

    As, un la propiedad value de un botn de un formulario se llamara window.document.form.button.value. Aunque window se puede quitar si es la misma ventana en la que est el formulario.

    La pgina se lee desde arriba hacia abajo. Por ello, no d b debemos usar objetos bj t antes t de d su creacin i . S Solo l al l definir d fi i funciones en la cabecera podemos romper esta regla, ya que la definicin de las funciones no implica su uso en el momento que se leen, sino que se llaman despus desde el cuerpo de la pgina.

    El objeto window (I)

    El objeto window i d es el ms importante. A partir de l se pueden crear nuevos objetos window que sern nuevas ventanas t ejecutando j t d el l navegador. d Adems permite cerrar ventanas, puede sacar mensajes de error error, confirmacin y entrada de datos. Apertura de una ventana
    window.open(

    "direccin URL");

    C Cerrar la l propia i ventana


    window.close()

    El objeto window (II)

    Temporalizadores
    setTimeout(

    instrucciones, tiempo, parametros );


    temporizador</TITLE>

    <HTML><HEAD><TITLE>Primer

    <SCRIPT>function mensaje(){ Tempor = setTimeout("alert('Este mensaje ha salido a los 5 segundos');",5000); } </SCRIPT></HEAD> / / <BODY onLoad="mensaje();">Hola </BODY></HTML>
    clearTimeout(
    clearTimeout(

    variable_de_temporizador );
    Tempor );

    Referenciar una ventana

    Por el nombre b de d la l variable i bl a la que se asign en la apertura. Por ejemplo:


    nuevaVentana=window.open("url","nombre_target","pa " "" ""

    rametros" ); nuevaVentana.document.write( V t d t it ("E Escribiendo ibi d en la l nueva ventana");

    self o window es la ventana actual de cada navegador en cada caso. top o parent es la l ventana t d de la l que d desciende i d un marco u otra ventana.

    El objeto history (I)

    Las direcciones que se visitan se guardan en el objeto history. Podemos crear nuestros propios botones de anterior y siguiente para movernos por las pginas. Propiedades
    history.current:

    URL completa de la entrada actual. actual history.next: URL completa de la siguiente del historial. history.length history length: El nmero de entradas del historial. historial history.previous: URL completa de la anterior.

    El objeto history (II)

    Funciones
    history.back().

    Vuelve a cargar la URL anterior. history.forward(). Vuelve a cargar la URL siguiente. history.go(posicion). y g (p ) Vuelve a cargar g la URL del documento especificado por posicion dentro del historial.

    Ejemplo
    <FORM>

    <input type= type="button" button value= value="Atras" Atras onClick="history.back();"> <input type="button" value="2 value 2 Atras Atras" onClick onClick="history.go(-2);"></FORM> history.go( 2); /FORM

    El objeto location

    Contiene informacin acerca de las propiedades de la pgina que hemos cargado, en particular de su nombre. As mantiene por separado las propiedades protocol, host, port, pathname, hash y search. Reload(): recarga la pgina
    window.location.reload()

    Assing(): carga una na n nueva e a pgina


    window.location.assign("http://www.google.com")

    El objeto document (I)

    Por cada pgina cargada en una ventana hay un objeto document contenedor de todos los elementos visibles de la pgina. Propiedades p relativas al color:
    alinkColor

    : color para enlaces al propio documento. bgColor: color de fondo. fondo fgColor: color de primer plano. linkColor li kC l : color l d de los l enlaces. l vlinkColor: color para enlaces visitados.

    El objeto document (II)

    Otra informacin contenida en document es:


    domain:

    El nombre del dominio del servidor. referer: La URL que llam al documento actual. URL: La URL completa p del documento.

    Funciones
    open()

    Abre un documento Ab d t close() Cierra el documento abierto anteriormente con d document.open() t () write() Escribe texto HTML o Javascript en un d documento. t writeln() Escribe texto pero haciendo saltos de linea

    El objeto document (III)

    Ejemplo 1
    <script>function crearDoc(){ var doc=document.open("text/html","replace"); d d (" /h l" " l ") var txt="<html><body>Aprendiendo a usar <b>document!</b></body></html> ; <b>document!</b></body></html>" doc.write(txt); doc.close(); }</script> <input type type="button" button value value= "Nuevo Nuevo documento documento" onclick="crearDoc()"></body></html>

    Ejemplo 2
    <script>var w=window.open(); w.document.open(); p (); w.document.write("<b>Hooola Mundo!!!</b>"); w.document.close();</script>

    Abrir una nueva ventana controlando su apariencia

    <script>function abrir_ventana(){ window.open("http://www.google.com","_blank","to p ( p // g g , , olbar=yes, location=yes, directories=no, status=no, menubar=yes, y , scrollbars=yes, y , resizable=no, , copyhistory=yes, width=400, height 400 );} /script height=400");}</script> <form> <i <input type="button" "b " value="Abrir l "Ab i Ventana" V " onclick=" abrir_ventana()"> </form>

    Abrir y cerrar una ventana

    <script>function openWin(){ vent=window.open("","","width=200,height=100"); p ( , , , g ); vent.document.write("<p>Esta es mi ventana </p> );} ventana'</p>");} function closeWin(){ vent.close();}</script> <input p type="button" yp value= "Abrir" onclick="openWin()" /> <input type type="button" button value value= "Cerrar" Cerrar onclick="closeWin()" />

    Imprimir la pgina actual

    <script> p p g (){ function imprimirpagina(){ window.print(); } </script> <input type type="button" button value value="Imprime Imprime esta pgina pgina" onclick=" imprimirpagina()" />

    Mostrar un reloj

    <script>function f startTime(){ { var today=new Date(); var h h=today.getHours(); today.getHours(); var m=today.getMinutes(); var s=today.getSeconds(); m=checkTime(m); s=checkTime(s); d document.getElementById('txt').innerHTML=h+":"+m+":"+s; t tEl tB Id('t t') i HTML h+" "+ +" "+ t=setTimeout(function(){startTime()},500);} ( ){ function checkTime(i){ if (i<10){ i="0" + i;} return i;}</script>

    <body onload="startTime()"><div id="txt"></div></body>

    Mas ejemplos

    Poner y quitar un cronometro


    http://www.w3schools.com/js/tryit.asp?filename=tryjs_

    timing_stop

    Leer los campos p de un formulario


    http://www.w3schools.com/jsref/tryit.asp?filename=tr

    yjsref_form_elements yj

    Muchos Ejemplos ms
    http://www.uv.es/jac/guia/jscript/javascr.htm http //www uv es/jac/guia/jscript/javascr htm

    Bibliografa

    Referencias de Objetos en Javascript: http://www.w3schools.com/jsref/obj_window.asp Objetos de una pgina: http://geneura.ugr.es/~victor/cursillos/curso_javascript_ba sico/js_pagina.html / Tutorial con ejemplos en espaol: http://es.scribd.com/doc/32660/Curso-Manual-TutorialJavascript-Con-Ejemplos Test Javascript http://www.w3schools.com/quiztest/quiztest.asp?qtest=Jav aScript S i

    You might also like