Recorrer el árbol de nodos del DOM XML

El término 'recorrer' significa recorrer el árbol de nodos.

Recorrer el árbol de nodos

A menudo necesitará recorrer un documento XML, por ejemplo: cuando desee extraer los valores de cada elemento.

Este proceso se llama 'recorrer el árbol de nodos'

Este ejemplo muestra cómo recorrer todos los nodos hijos de <book> y mostrar sus nombres y valores:

Ejemplo

<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var x, i ,xmlDoc;
var txt = "";
var text = "<book>" +
"<title>雅舍谈吃</title>" +
"<author>梁实秋</author>" +
"<year>2013</year>" +
"</book>";
parser = new DOMParser();
xmlDoc = parser.parseFromString(text,"text/xml");
// documentElement siempre representa el nodo raíz
x = xmlDoc.documentElement.childNodes;
for (i = 0; i < x.length ;i++) {
    txt += x[i].nodeName + ": " + x[i].childNodes[0].nodeValue + "<br>";
}
document.getElementById("demo").innerHTML = txt;
</script>
</body>
</html>

Prueba personalmente

Ejemplo de explicación:

  1. Cargar la cadena XML en xmlDoc en
  2. Obtener los nodos hijos del elemento raíz
  3. Mostrar el nombre de cada nodo hijo y el valor del nodo de texto

Diferencias en la解析 de DOM entre los navegadores

Todos los navegadores modernos admiten el estándar W3C DOM.

Sin embargo, hay algunas diferencias entre los navegadores.

La forma en que los procesan

DOM - Espacios en blanco y nuevas líneas

XML generalmente incluye caracteres de nueva línea o espacios en blanco entre los nodos. Esto suele ocurrir cuando se edita el documento con editores simples como el bloc de notas.

El siguiente ejemplo (editado en bloc de notas) contiene CR/LF (caracteres de nueva línea) entre cada línea y dos espacios antes de cada nodo hijo:

<book>
  <title>Charlas sobre la cocina</title>
  <author>Liang Shiqiu</author>
  <press>Editorial de Literatura de Jiangsu</press>
  <year>2013</year>
  <price>35</price>
  <ISBN>9787539962771</ISBN>
</book>

Internet Explorer 9 y versiones anteriores no consideran los espacios en blanco o las nuevas líneas como nodos de texto, mientras que otros navegadores sí lo hacen.

El siguiente ejemplo mostrará el número de nodos hijos que posee el elemento raíz (books.xml). Las versiones de IE9 y anteriores mostrarán 6 nodos hijos, mientras que las versiones de IE10 y posteriores y otros navegadores mostrarán 9 nodos hijos:

Ejemplo

function myFunction(xml) {
var xmlDoc = xml.responseXML;
    x = xmlDoc.documentElement.childNodes;
    document.getElementById("demo").innerHTML =
    "Número de subnodos: " + x.length;
}

Prueba personalmente

PCDATA - Datos de carácter analizados (Parsed Character Data)

Los analizadores XML suelen analizar todo el texto del documento XML.

Al analizar elementos XML, también se analiza el texto entre las marcas XML:

<message>Este texto también será analizado</message>

El analizador realiza esta operación porque los elementos XML pueden contener otros elementos, como se muestra en este ejemplo, donde el elemento <name> contiene otros dos elementos (first y last):

<name><first>Bill</first><last>Gates</last></name>

El analizador lo descompone en los siguientes subelementos:

<name>
  <first>Bill</first>
  <last>Gates</last>
</name>

“Carácter de datos analizados” (PCDATA), este término se utiliza para describir los datos de texto que serán analizados por el analizador XML.

CDATA - Datos de carácter no analizados (Unparsed Character Data)

El término CDATA se utiliza para describir los datos de texto que no deben ser analizados por el analizador XML.

"<" y "&Los caracteres " y otros son ilegales en los elementos XML.

"<" generará errores porque el analizador lo interpreta como el inicio de un nuevo elemento.

"&" generará errores porque el analizador lo interpreta como el inicio de un ente de carácter.

Algunos textos (por ejemplo, código JavaScript) contienen una gran cantidad de "<" o "&" Carácter. Para evitar errores, puede definir el código del script como CDATA.

Todos los contenidos dentro de la parte de CDATA serán ignorados por el analizador.

" Parte de CDATA con "<![CDATA[" Inicio, con "]]>" Finalización: "

<script>
<![CDATA[
function matchwo(a,b) {
    if (a < b && a < 0) {
        return 1;
    else {
        return 0;
    }
}
]]>
</script>

En el ejemplo anterior, el analizador ignora todo el contenido dentro de la sección CDATA.

Notas sobre la sección CDATA:

La sección CDATA no puede contener la cadena "]]>". No se permite la nesting de secciones CDATA.

" para marcar el final de la sección CDATA]]>" No puede contener espacios o saltos de línea.