Javascript, XPath o "como mandar getelement* al tacho"

Como saben, estuve programando MUCHO en javascript para hacer la extension Enigform para Firefox. Obviamente, me puse a crear extensioens para otras cosas.

Ahora, tuve que desempolvar mi javascript, que estaba bastante oxidado, asi que estuve chusmeando por aqui y por alli… de hecho, estoy pensando una serie de articulos de como hacer extensiones para firefox, ya que casi toda la documentacion que hay esta en inglish :P

Por el momento, les paso este tip:

Vieron que se puede encontrar, digamos, todos los elementos cuyo tag html sea TD y luego acceder al innerHTML y modificarlo, mediante el uso del array devuelto por el metodo getElementsByTagName. Por ejemplo, digamos que tenemos esta tabla:

<HTML><BODY><TABLE><TR><TD>celda 1</TD><TD>celda 2</TD></TR><TR><TD>celda a</TD><TD>celda b</TD><TD>celda c</TD></TR></TABLE></BODY></HTML>

Como ven, podriamos referencia a la “celda b”, usando:

var celdaB = document.getElementsByTagName["td"][3];

y el “celdaB.innerHTML” seria el texto “celda b”.

Ahora, tambien podriamos referenciar a la celda B mediante algo llamado XPath:

var celdaB = document.evaluate('/html/body/table/tbody/tr[2]/td[2]',document,null,XPathResult.STRING_TYPE,null).stringValue);

y “celdaB” seria un string = “celda b”, PERO no tenemos acceso a innerHTML, o sea, XPath, en principio, parece ser de solo lectura.

Obviamente, despues de googlear un cacho, finalmente encontre la respuesta a mi dilema “Como usar XPath para referenciar un objeto, y tambien poder modificarlo?”. Sencillo, mediante el uso de XPath SnapShots, o de First Nodes. Para simplificar el ejemplo, voy a mostrarles un caso First Node:

celdaB = doc.evaluate('/html/body/table/tbody/tr[2]/td[2]',doc,null,XPathResult.FIRST_ORDERED_NODE_TYPE,null);

celdaB.singleNodeValue.innerHTML = "Nuevo texto de celda B";

Sencillo y elegante, no?

Los invito a investigar mas sobre XPath: Introduction to using XPath in JavaScript

Saludos,
Buanzo

Artículos relacionados:

Si te gustó este articulo, ¿ Porque no dejas un comentario a continuación y continuas la conversación, o te suscribes a los feeds y recibes los artículos directamente en tu lector?

Comentarios

No comments yet.

Leave a comment

(required)

(required)


Aquellos que leyeron este artículo luego leyeron lo siguiente: