SlideShare una empresa de Scribd logo
DOM Document Object Model
Que es DOM Dom es una plataforma o interfaz neutral que permite a los programas y scripts accesar o modificar el contenido, estructura y estilo de los documentos.  Una interfaz de programación para XML Un estandar W3C Un modelo de objetos para XML
Origen del DOM Recomendaciones HTML (HTML 2.0-4.0) 1995/1999 Separar el contenido de la presentaciòn mediante hojas de estilo Respuesta a las demandas de usuarios, por lo que se aumentaba el nùmero de etiquetas
Origen del DOM Recomendaciones XML 1998 se aprobò la recomendaciòn XML 1.0 XHTML 2000 aprobaciòn de XHTML 1.0 2002 XHTML segunda ediciòn
Origen del DOM ECMAScript (European Computer Manufacturers Association) Normas ECMA-262 y ECMA-357 (1998/2004) Javascript 1.0 incorporaba una forma de acceder y manipular los elementos de la pàgina y recibiò el nombre de DOM nivel 0. DHTML
Requerimientos generales No dependiende del lenguaje y de la plataforma Un nùcleo aplicable a HTML, CSS y XML Construcciòn y destrucciòn del documento No se requiere IU  para implementar el modelo
DOM nivel 1- Navegación Estructural Núcleo: La sección del Núcleo DOM1 provee un conjunto de bajo nivel de interfaces que pueden representar a cualquier documento estructurado  HTML: La sección de HTML nivel 1 provee interfaces adicionales de más alto nivel que se utilizan junto con las interfaces definidas en el nivel 1 del núcleo para proporcionar una vista conveniente de un documento HTML.  Interfaces DOM1:  incluyen la interfaz para el Documento, Nodos, Atributos, Elementos, y el texto.
DOM nivel 1- Manipulación de documentos Proveer una manera de agregar, remover y cambiar elementos y/o etiquetas en la estructura del documento. Proveer una manera de añadir, remover o cambiar los atributos en a estructura del documento. Las operaciones o su combinación deberán asegurar y restaurar la consistencia antes de que hagan el return.
DOM nivel 1- Manipulación de contenido Proveer una manera de determinar el elemento  contenedor  desde cualquier parte del documento Proveer una manera de navegar el contenido
Estructura DOM Elemento Raíz Cualquier nodo excepto el raíz tiene exactamente un nodo padre Un nodo puede tener cualquier número de hijos Una hoja es un nodo con ningún hijo Siblings. Son nodos con el mismo nodo padre
DOM-DOCUMENT
DOM-NODO (TIPOS)
DOM-NODO(DEFINICION)
NODOS-COMPARATIVO
DOM-NODELIST
DOM-NAMEDNODEMAP
COM-CHARACTERDATA
DOM-ATTRIBUTE
DOM-ELEMENT
DOM-TEXT
DOM-COMMENT Y CDATA
Ejemplos 1. books.xml Tips: Un error común es creer que el elemento contiene cierto texto, lo cierto es que el texto es almacenado en un nodo texto 2. file.html 3. String.html 4. consultas 5. modificaciones
DOM nivel 2- Modelo de eventos El modelo deberá ser lo suficientemente rico para crear documentos completamente interactivos.  Todos los elementos serán capaces de generar eventos Proveer eventos de interfaz y lógicos El mecanismo de eventos permitirá  el overriding del comportamiento por default El modelo de eventos proveerá un mecanismo por el cual eventos para elementos específicos podrán ser recibidos por un ancestro en la jerarquía DOM Los eventos deberán ser sincronos
Tipos de eventos UI events  Eventos de la inerfaz de usuario, generados por un dispositivo externo  UI Logical events  Independientes del usuario,como focus, cambio de mensajes o triggers.  Mutation events  Eventos causados por una acci´n que modifica la estructura del documentos.  Capturing  El proceso por el cual un evento puede ser manejado por un padre del objetivo del evento antes que sea manejado por este .  Bubbling  El proceso por el cual un evento se propaga a traves de los ancestros despues de haber sido manejado por el objeto generador.
DOM nivel 2- Modelo de hojas de estilo El modelo deberá ser extensible a otros formatos en un futuro Habra un modelo de hojas de estilos embedido, donde el core podrà ser aplicable a otros lenguajes de estilos. Los estilos podran ser agregados, removidos o modificados Lo anterior aplica para hojas de estilos ligadas, importados o alternativas.
DOM nivel 2- Modelo de rangos Vista lineal Permitirá consultas y ediciones de funcionalidad basados en un rango de texto en lugar de un árbol de nodos Live Ediciones en el rango modificando el árbol subyacente Operaciones Creación  de un objeto rango Extracción de texto desde un rango con o si etiquetas Inserción y borrado de texto dentro de un rango Inserción  borrado de cierta estructura dentro de un rango
DOM nivel 2- Modelo de recorrido Deberá de ser capaz de visualizar vistas filtradas sin comentarios o referencias. Tener un iterador robusto
Ejemplos 1. estilos 2. eventos1 3. eventos2
DOM nivel 3- Requerimientos generales Modificaciones al núcleo para solucionar problemas de los niveles anteriores Modificaciones al modelo de eventos Lectura y escritura de documentos (XML- estructura de árbol)
Frameworks DOJO PROTOTYPE Script.aculo.us -> Efectos JQUERY JQUERY UI -> Efectos Mootol

Más contenido relacionado

PPTX
Diagrama de actividades
PPT
Uml diagramas-caso-de-uso
DOCX
25 Estandares - IEEE Calidad de Software
PPT
Planificación de procesos
PDF
Flujo datos
PPTX
Arquitectura de software para aplicaciones móviles
PDF
Introducción a UML
DOCX
Cuestionario uml y objetos zuli
Diagrama de actividades
Uml diagramas-caso-de-uso
25 Estandares - IEEE Calidad de Software
Planificación de procesos
Flujo datos
Arquitectura de software para aplicaciones móviles
Introducción a UML
Cuestionario uml y objetos zuli

La actualidad más candente (20)

PPT
Generador de codigo intermedio
PPTX
Comercio electrónico
PPT
Comparacion Entre Rmi Y Api De Sockets
PPT
13 clase-flujo-de-analisis
PDF
Ingeniería de software II- Parte 3.2
PDF
Unidadi. lenguajes de interfaz
PPTX
Get & post
PDF
Tabla De Transicion
PDF
Prueba de Caja Blanca
PPTX
6. pseudoestrabismo
PPT
Modelos de dominio
PPT
Estilos de programación y sus lenguajes
PDF
Uml clase 04_uml_clases
PDF
HIPERMETROPIA.pdf
PPTX
Astigmatismo
PPT
Arquitectura 3 Capas
PPTX
Tienda virtual
DOCX
Trabajo final uml_200609_19
PPTX
Elaboración de Interfaces
Generador de codigo intermedio
Comercio electrónico
Comparacion Entre Rmi Y Api De Sockets
13 clase-flujo-de-analisis
Ingeniería de software II- Parte 3.2
Unidadi. lenguajes de interfaz
Get & post
Tabla De Transicion
Prueba de Caja Blanca
6. pseudoestrabismo
Modelos de dominio
Estilos de programación y sus lenguajes
Uml clase 04_uml_clases
HIPERMETROPIA.pdf
Astigmatismo
Arquitectura 3 Capas
Tienda virtual
Trabajo final uml_200609_19
Elaboración de Interfaces
Publicidad

Destacado (20)

PPT
Document Object Model
PPTX
Document object model(dom)
PPTX
An Introduction to the DOM
PPTX
Document Object Model
PDF
Javascript and DOM
PPTX
Dom(document object model)
PPTX
XML Document Object Model (DOM)
PPTX
PPT
JavaScript & Dom Manipulation
PDF
Document Object Model (DOM) Level 1 Specification
PDF
eXtensible Markup Language APIs in Java 1.6 - Simple and efficient XML parsin...
PDF
JavaScript and DOM
PPTX
Xml processors
PPTX
HTML Block and Inline Elements
DOCX
Elementos primordiales en el modelo de objetos
PPT
XML SAX PARSING
PPTX
programacion para la web (Dom)
PPTX
Javascript basics
PDF
Working with Arrays in JavaScript
PPTX
Document Object Model
Document object model(dom)
An Introduction to the DOM
Document Object Model
Javascript and DOM
Dom(document object model)
XML Document Object Model (DOM)
JavaScript & Dom Manipulation
Document Object Model (DOM) Level 1 Specification
eXtensible Markup Language APIs in Java 1.6 - Simple and efficient XML parsin...
JavaScript and DOM
Xml processors
HTML Block and Inline Elements
Elementos primordiales en el modelo de objetos
XML SAX PARSING
programacion para la web (Dom)
Javascript basics
Working with Arrays in JavaScript
Publicidad

Similar a DOM ( Document Object Model ) (20)

PPTX
domPwebAula03.pptx
PPT
DOM Document Object Model DOM Document Object Model
PPT
XML Y RDF En Web SemáNtica
PPT
XML y RDF en Web Semántica
PDF
Desarrollo de Aplicaciones Web II - Sesión 03 - Formularios y Validaciones
PDF
Visualizacion
PPT
Apuntes de HTML 1
PDF
Procesamiento de XML en C#
PDF
Tutor javawebparte2
PDF
6. Utilización del modelo de objetos del documento (DOM)
PPTX
C2 lenguaje html
PPTX
7-Unidad 2: Diseños de Vista-2.3 Introducción Web Services-Desarrollo Ejemplos
PDF
Clase 8 Manipulación del DOM
PPT
Presentación muy chula ApéndiceTecnologíaXML.ppt
PPTX
Html5, css3, java script
PPTX
Camilo diaz
PPT
Ead aplicaciones prácticas
PPTX
Xml presentacin
PDF
domPwebAula03.pptx
DOM Document Object Model DOM Document Object Model
XML Y RDF En Web SemáNtica
XML y RDF en Web Semántica
Desarrollo de Aplicaciones Web II - Sesión 03 - Formularios y Validaciones
Visualizacion
Apuntes de HTML 1
Procesamiento de XML en C#
Tutor javawebparte2
6. Utilización del modelo de objetos del documento (DOM)
C2 lenguaje html
7-Unidad 2: Diseños de Vista-2.3 Introducción Web Services-Desarrollo Ejemplos
Clase 8 Manipulación del DOM
Presentación muy chula ApéndiceTecnologíaXML.ppt
Html5, css3, java script
Camilo diaz
Ead aplicaciones prácticas
Xml presentacin

Último (6)

PDF
AINES PDF.pdfssssssssssssssssssssssssssssssssssssssssssssss
PDF
1 Sistema Musculoesquelético. Lic. Pablo Rivas.pdf
PDF
EL STREAMING COMO FORMA DE ENTRETENIMIENTO
PPTX
UNICEN.pptxJBJHFYTDRGFXHGVKJBLJK}L´LKOPUOIY
PPT
aditivos1.pptaditivos1.pptaditivos1.pptaditivos1.ppt
PDF
Bestias de la Edad Oscura - Pandemónium - Acto I y II
AINES PDF.pdfssssssssssssssssssssssssssssssssssssssssssssss
1 Sistema Musculoesquelético. Lic. Pablo Rivas.pdf
EL STREAMING COMO FORMA DE ENTRETENIMIENTO
UNICEN.pptxJBJHFYTDRGFXHGVKJBLJK}L´LKOPUOIY
aditivos1.pptaditivos1.pptaditivos1.pptaditivos1.ppt
Bestias de la Edad Oscura - Pandemónium - Acto I y II

DOM ( Document Object Model )

  • 2. Que es DOM Dom es una plataforma o interfaz neutral que permite a los programas y scripts accesar o modificar el contenido, estructura y estilo de los documentos. Una interfaz de programación para XML Un estandar W3C Un modelo de objetos para XML
  • 3. Origen del DOM Recomendaciones HTML (HTML 2.0-4.0) 1995/1999 Separar el contenido de la presentaciòn mediante hojas de estilo Respuesta a las demandas de usuarios, por lo que se aumentaba el nùmero de etiquetas
  • 4. Origen del DOM Recomendaciones XML 1998 se aprobò la recomendaciòn XML 1.0 XHTML 2000 aprobaciòn de XHTML 1.0 2002 XHTML segunda ediciòn
  • 5. Origen del DOM ECMAScript (European Computer Manufacturers Association) Normas ECMA-262 y ECMA-357 (1998/2004) Javascript 1.0 incorporaba una forma de acceder y manipular los elementos de la pàgina y recibiò el nombre de DOM nivel 0. DHTML
  • 6. Requerimientos generales No dependiende del lenguaje y de la plataforma Un nùcleo aplicable a HTML, CSS y XML Construcciòn y destrucciòn del documento No se requiere IU para implementar el modelo
  • 7. DOM nivel 1- Navegación Estructural Núcleo: La sección del Núcleo DOM1 provee un conjunto de bajo nivel de interfaces que pueden representar a cualquier documento estructurado HTML: La sección de HTML nivel 1 provee interfaces adicionales de más alto nivel que se utilizan junto con las interfaces definidas en el nivel 1 del núcleo para proporcionar una vista conveniente de un documento HTML. Interfaces DOM1: incluyen la interfaz para el Documento, Nodos, Atributos, Elementos, y el texto.
  • 8. DOM nivel 1- Manipulación de documentos Proveer una manera de agregar, remover y cambiar elementos y/o etiquetas en la estructura del documento. Proveer una manera de añadir, remover o cambiar los atributos en a estructura del documento. Las operaciones o su combinación deberán asegurar y restaurar la consistencia antes de que hagan el return.
  • 9. DOM nivel 1- Manipulación de contenido Proveer una manera de determinar el elemento contenedor desde cualquier parte del documento Proveer una manera de navegar el contenido
  • 10. Estructura DOM Elemento Raíz Cualquier nodo excepto el raíz tiene exactamente un nodo padre Un nodo puede tener cualquier número de hijos Una hoja es un nodo con ningún hijo Siblings. Son nodos con el mismo nodo padre
  • 22. Ejemplos 1. books.xml Tips: Un error común es creer que el elemento contiene cierto texto, lo cierto es que el texto es almacenado en un nodo texto 2. file.html 3. String.html 4. consultas 5. modificaciones
  • 23. DOM nivel 2- Modelo de eventos El modelo deberá ser lo suficientemente rico para crear documentos completamente interactivos. Todos los elementos serán capaces de generar eventos Proveer eventos de interfaz y lógicos El mecanismo de eventos permitirá el overriding del comportamiento por default El modelo de eventos proveerá un mecanismo por el cual eventos para elementos específicos podrán ser recibidos por un ancestro en la jerarquía DOM Los eventos deberán ser sincronos
  • 24. Tipos de eventos UI events Eventos de la inerfaz de usuario, generados por un dispositivo externo UI Logical events Independientes del usuario,como focus, cambio de mensajes o triggers. Mutation events Eventos causados por una acci´n que modifica la estructura del documentos. Capturing El proceso por el cual un evento puede ser manejado por un padre del objetivo del evento antes que sea manejado por este . Bubbling El proceso por el cual un evento se propaga a traves de los ancestros despues de haber sido manejado por el objeto generador.
  • 25. DOM nivel 2- Modelo de hojas de estilo El modelo deberá ser extensible a otros formatos en un futuro Habra un modelo de hojas de estilos embedido, donde el core podrà ser aplicable a otros lenguajes de estilos. Los estilos podran ser agregados, removidos o modificados Lo anterior aplica para hojas de estilos ligadas, importados o alternativas.
  • 26. DOM nivel 2- Modelo de rangos Vista lineal Permitirá consultas y ediciones de funcionalidad basados en un rango de texto en lugar de un árbol de nodos Live Ediciones en el rango modificando el árbol subyacente Operaciones Creación de un objeto rango Extracción de texto desde un rango con o si etiquetas Inserción y borrado de texto dentro de un rango Inserción borrado de cierta estructura dentro de un rango
  • 27. DOM nivel 2- Modelo de recorrido Deberá de ser capaz de visualizar vistas filtradas sin comentarios o referencias. Tener un iterador robusto
  • 28. Ejemplos 1. estilos 2. eventos1 3. eventos2
  • 29. DOM nivel 3- Requerimientos generales Modificaciones al núcleo para solucionar problemas de los niveles anteriores Modificaciones al modelo de eventos Lectura y escritura de documentos (XML- estructura de árbol)
  • 30. Frameworks DOJO PROTOTYPE Script.aculo.us -> Efectos JQUERY JQUERY UI -> Efectos Mootol