Logo

Complementos y nuevas tendencias en la programación web

Manuales web avanzados

Por Anyelguti

Este curso forma parte del proyecto Aprende Web

logo

DOM VI

Aspectos del DOM y XML

Cargar una cadena XML

En páginas anteriores vimos cómo cargar un documento XML para ser analizado por javascrit. Sin embargo también es posible cargar una cadena de texto o "string" que contiene un documento XML para ser analizado con javascript. Utilizamos entonces otro objeto del navegador llamado DOMParser. Supongamos que tenemos un documento XML guardado en la variable texto, el código para acceder al documento con javascript será:

if (window.DOMParser) {
    parser=new DOMParser();
    xmlDoc=parser.parseFromString(texto,"text/xml");
    }
else {  // Internet Explorer
    xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
    xmlDoc.async="false";
    xmlDoc.loadXML(texto);
    } 

Vemos aquí que la mayoría de los navegadores utilizan el objeto DOMParser mientras que Internet Explorer utiliza un control "ActiveX". El código anterior carga un documento XML guardado en una variable de tipo "cadena". Lo único que puede variar es el nombre de la variable donde guardamos el documento XML, que aquí la hemos llamado texto.

Acceso entre dominios

Por motivos de seguridad los navegadores no permiten acceder a un documento XML que esté en otro dominio o sitio web, por lo que tanto el archivo XML como la página que lo muestra deben estar ubicados en el mismo servidor.

Acceso a atributos

El acceso a los atributos puede hacerse de varias maneras, pongamos por ejemplo que tenemos la siguiente etiqueta XML con varios atributos.

<foto archivo="fotos/troncomovil.gif" pie="Troncomóvil."/>

Una vez cargado el documento XML, Accedemos en primer lugar al nodo elemento:

mifoto=xmlDoc.getElementsByTagName("foto)[0];

Después tenemos varias formas de acceder a los atributos. Podemos crear un array con todos los atributos del elemento, mediante la propiedad attributes

atrib=mifoto.attributes

Para luego acceder a cada uno de ellos mediante su número de posición en el array. La propiedad nodeValue nos dará el valor del atributo.

ruta_mifoto=atrib[0].nodeValue;

texto_mifoto=atrib[1].nodeValue;

O también podemos utilizar el método getAttribute(), que aplicado directamente al nodo "element" nos devuelve el valor del atributo. como parámetro pasamos el nombre del atriibuto.

ruta_mifoto=mifoto.getAttribute("archivo");

texto_mifoto=mifoto.getAttribute("pie");

Otras operaciones que podemos hacer con atributos es cambiar el valor del atributo o crearlo nuevo mediante setAttribute(), o eliminarlo mediante removeAttribute().

Diferencias entre navegadores

Todos los navegadores son compatibles con el acceso al DOM para documentos XML, sin embargo existen diferencias entre unos y otros.

Una de las principales diferencias es la forma de manejar los espacios en blanco entre etiquetas.

Entendemos por espacio en blanco, no sólo el espacio en blanco, sino también los saltos de línea o tabuladores en el código XML.

Mientras que Internet Explorer los ignora, el resto de navegadores los trata como si fueran nodos de texto cuyo texto es un espacio en blanco.

Debemos tener esto en cuenta al utilizar propiedades como childNodes o nextSibbling.

Si sólo queremos obtener los nodos tipo "element" debemos poner alguna instrucción condicional (tipo if), que limite los nodos a los de tipo "element" usando la propiedad nodeType. Para los nodos de tipo "element" la propiedad nodeType tiene valor 1. (véase el ejemplo de la página 5 de este manual).

Manipular los nodos

Podemos manipular los nodos en XML de la misma manera que lo haríamos con HTML, es decir usando los métodos y propiedades siguientes, de igual manera que con HTML. El uso de la mayoría de estos métodos y propiedades viene explicado en el Curso de javascript: 5. Acceso al DOM

Crear nuevas etiquetas e insertarlas: Al igual que hacemos en HTML mediante createElement() y createTextNode() creamos el nodo "element" que contiene la etiqueta y el nodo "text" que contiene el texto. Hacemos depender uno de otro mediante appendChild(), y despues mediante appendChild() o insertBefore() insertamos el nodo en el documento.

Eliminar nodos: El método removeChild() sirve para eliminar un nodo. El método removeAttribute elimina un nodo atributo, tal como se ha explicado anteriormente.

Reemplazar nodos: El método replaceChild remplaza un nodo por otro, tal como explica en el curso de javascript. También podemos reemplazar el valor de un nodo reescribiendolo con la propiedad nodeValue.

Duplicar nodos:: El método cloneNode() permite duplicar un nodo. La forma de utilizarlo viene explicada en el curso de javascript.

Propiedades y métodos del documento

Las siguientes propiedades se aplican al objeto raiz (xmlDoc), y muestran información sobre el mismo.







Termina aquí el manual de DOM. El él hemos visto cómo acceder al DOM de forma dinámica, es decir con javascript, tanto en las páginas en HTML como en los documentos en XML. Espero que os haya sido útil.



Manual de DOM

Anterior siguiente     Siguiente siguiente

Ver estadísticas

Free counter and web stats
Visita nuestro foro:

Puedes consultar tus dudas y sugerencias:

sobre el foro (info y entrar)

Página creada por ANYELGUTI.

Manda tus sugerencias:
aprendeweb@ymail.com ... manda un correo