- From: Thomas Ashe <Thomas.Ashe@Blackbaud.com>
- Date: Wed, 11 Oct 2000 12:36:34 -0400
- To: www-dom@w3.org
On Wednesday, October 11, 2000 11:28 AM, Andreas Girgensohn
[mailto:ag_nospam@fnmail.com] wrote:
> I'm trying to understand the differences between Microsoft's
> implementation of Dynamic HTML and DOM Level 2. In particular, I find
> one example of Microsoft's implementation very useful and I wonder how
> I could accomplish the same using only DOM methods.
>
> <A HREF="your-link-here"
> ONMOUSEOVER="this.innerText='Click Me Please'"
> ONMOUSEOUT="this.innerText='your-text-here'"
> >your-text-here</A>
>
> As I understand, DOM does not provide an innerText attribute and I'm
> unclear how I would accomplish the same using the methods for
> accessing
> and replacing nodes.
>
Andreas,
The A node, in your example, has a single child. This child is a text node,
containing 'your-text-here'.
To change this, you would traverse to this node, then modify its data
attribute.
In your example, it would be:
<A HREF="your-link-here"
ONMOUSEOVER="this.firstChild.data='Click Me Please'"
ONMOUSEOUT="this.firstChild.data='your-text-here'">your-text-here</A>
or
<A HREF="your-link-here"
ONMOUSEOVER="this.childNodes.item(0).data='Click Me Please'"
ONMOUSEOUT="this.childNodes.item(0).data='your-text-here'">your-text-here</A
>
If your node does not start out with a text node, then you will need to
create one. For example,
<script type="text/javascript">
function setText(o,sText) {
if (o.firstChild==null) {
var oTextNode=document.createTextNode(sText)
o.appendChild(oTextNode)
} else {
o.firstChild.data=sText
}
}
</script>
<A HREF="your-link-here"
ONMOUSEOVER="setText(this,'Click Me Please')"
ONMOUSEOUT="setText(this,'your-text-here')"></A>
If your node contains other nodes(i.e. images, etc...), you will need to
program accordingly, some possibilities include:
- removing all nodes and then adding a text node
- walking the child nodes until you find a text node(by testing the
nodeType attribute)
Regards,
-Tom
Received on Wednesday, 11 October 2000 12:37:16 UTC