Curso de Javascript: Objetos window, document y forms
Introducción
En Javascript existen una serie de objetos predefinidos que permiten acceder al DOM, dichos objetos sustentan la representación de la ventana, el documento y los formularios presentes en el mismo. window, document y forms son los tres objetos principales de Javascript, ya que siempre podemos interactuar con ellos.
El objeto window
El objeto window, representa a la actual “ventana” lo que a día de hoy representa a una pestaña dentro del navegador. A través de window podemos saber sus dimensiones y podremos interactuar con ella.
Propiedades principales
- document: el objeto principal de window, representa el documento que se está presentando en pantalla.
- innerHeigth, innerWidth: representan el tamaño en alto y ancho, respectivamente de la ventana que dibuja la página.
- history: histórico de páginas visitadas.
- location: dirección URL actual.
- name: nombre de la ventana.
Métodos principales
- alert(): presenta un popup con un mensaje
- back(): vuelve atrás en el histórico
- close(): cierra la ventana
- home(): vuelve a la página inicial del navegador
- forward(): a la siguiente url del histórico
- open(): abre una nueva ventana
- resizeTo(): redimensiona la pantalla
- setInterval(): define un script que se ejecute cada cierto tiempo
- setTimeout(): define un script para que se ejecute una vez pasado cierto tiempo
El objeto document
Representa el documento (HTML) actual en memoria, permite buscar, modificar y eliminar elementos del documento.
Propiedades principales
- body: representa el elemento body, etiqueta html.
- cookie: pares clave-valor de las cookies relacionadas con el documento
- forms: array de formularios del documento
- images: array de imágenes del documento
- links: enlaces del documento
- referer: url de la página de la que venimos
- title: título del documento
- URL: url completa del documento
Métodos principales
- addEventListener(): permite cambiar el comportamiento de ante un evento
- createAttribute(): crea un atributo de Elemento
- createElement(): crea un nuevo elemento-etiqueta
- createTextNode(): crea un nuevo nodo de texto
- getElementById(): busca un elemento por su id
- getElementsByTagName(): busca elementos por etiqueta
- write(): escribe dentro de body
- writeln(): escribe dentro de body una nueva línea
Eventos principales
- onload: cuando se termina de leer la página
- onunload: cuando salimos de una página
El Objeto forms
Forms representa a los formularios presentes dentro de la página. document.forms
Representa un array con todos los formularios. Para acceder a cada una de las propiedades del objeto representarán cada uno de los campos del formulario, según hayamos rellenado el atributo “name”.
Propiedades principales
- length: número del elementos del formulario
- action: url donde enviaremos el formulario
- method: get o post según vayamos a enviar el formulario
- name: nombre del formulario
- encoding: codificación de envío del formulario
Métodos principales
- submit(): envía el formulario
- reset(): reinicia los valores de los campos del formulario
Eventos principales
- onsubmit(): función que realizará al enviar el formulario
- onreset(): función que limpiará los campos del formulario
Referencias
- window: http://www.w3schools.com/jsref/obj_window.asp
- document: http://www.w3schools.com/jsref/dom_obj_document.asp
- forms: http://www.w3schools.com/jsref/coll_doc_forms.asp
Este obra está bajo una licencia Creative Commons Reconocimiento-NoComercial-CompartirIgual 3.0 España.