DOM XML

¿Qué es el DOM?

El Modelo de Objetos de Documento (DOM) define los estándares para acceder y operar con el documento:

“El Modelo de Objetos de Documento (DOM) de W3C es una interfaz independiente de plataforma y lenguaje que permite a los programas y scripts acceder y actualizar dinámicamente el contenido, la estructura y el estilo del documento.”

HTML DOM Define los métodos estándar para acceder y operar con documentos HTML. Presenta el documento HTML como una estructura de árbol.

DOM XML Define los métodos estándar para acceder y operar con documentos XML. Presenta el documento XML como una estructura de árbol.

Para cualquier desarrollador que utilice HTML o XML, entender el DOM es obligatorio.

HTML DOM

Todos los elementos HTML pueden ser accedidos mediante el DOM (Modelo de Objetos de Documento).

El siguiente ejemplo cambia el valor del elemento HTML con id="demo":

Ejemplo

<h1 id="demo">Este es el título</h1>
<button type="button" onclick="document.getElementById('demo').innerHTML = '¡Hola Mundo!'">
¡Haga clic aquí!
</button>

Pruebe usted mismo

Puedes aprender más sobre HTML DOM para obtener más información.

DOM XML

Todos los elementos XML pueden ser accedidos a través del XML DOM.

Books.xml

<?xml version="1.0" encoding="UTF-8"?>
<bookstore>
  <book category="美食">
    <title lang="zh">雅舍谈吃</title>
    <author>梁实秋</author>
    <year>2013</year>
    <price>35</price>
  </book>
  <book category="儿童">
    <title lang="zh">了不起的狐狸爸爸</title>
    <author>罗尔德·达尔</author>
    <year>2009</year>
    <price>10.00</price>
  </book>
</bookstore>

Este código recupera el valor de texto del primer elemento <title> del documento XML:

Ejemplo

txt = xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue;

XML DOM es el estándar para obtener, modificar, agregar y eliminar elementos XML.

Este ejemplo carga una cadena de texto en un objeto DOM XML y utiliza JavaScript para extraer información de él:

Ejemplo

<html>
<body>
<p id="demo"></p>
<script>
var text, parser, xmlDoc;
text = "<bookstore><book>" +
"<title>雅舍谈吃</title>" +
"<author>梁实秋</author>" +
"<year>2009</year>" +
"</book></bookstore>";
parser = new DOMParser();
xmlDoc = parser.parseFromString(text,"text/xml");
document.getElementById("demo").innerHTML =
xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue;
</script>
</body>
</html>

Pruebe usted mismo

Aprenderá sobre DOM XML más contenido.